问题描述
限时送ChatGPT账号..我正在尝试使单个 JavaScript 能够随机化多个链接这些链接必须使用取自文本字段的片段构建，然后通过单击按钮在其自己的选项卡上打开每个链接.
我知道 2 种不同的 JavaScript 可以分别做这两件事:
b) 随机化在各自的标签上打开每个链接之前的几个链接
但我找不到一种可行的方法将它们中的两个混合到一个 JavaScript 中.
我尝试了几种方法来实现这一点，但我根本不是专家，所以我一直在失败.
为了让这篇文章更容易理解，我做了一个 fiddle，但不幸的是，来自 fiddle 的链接通常在许多网站上都被屏蔽，因此我改用了 w3schools 页面，以使我的示例能够正常工作:
然后为 3 个字段中的每一个选择内容.
如果它有帮助，我怀疑我的问题是没有正确定位这条线:
var a=$("#searchSince").val(),b=$("#searchUntil").val(),c=$("#searchLiveOrTop").val();因为结果 URL 一直显示未定义"
我愿意接受所有建议，甚至完全修改此脚本，因此请随时提出任何建议.
欢迎提出所有建议，因为它们都有很大帮助.
提前致谢.
解决方案问题是当表单数据改变时你永远不会更新srchTwtrClbrts，所以你需要监听文本的任何变化框并更新 srchTwtrClbrts.
我将 formChange 类添加到主 div 中，然后监听它的变化:
<输入类型=文本"id="searchSince"类=SrchTwtr"；样式=宽度:100像素！重要的；margin-right: 5px;"></表单><span style="position: relative;顶部:1px；margin-right: 5px;">直到:</span><div id="form-searchUntil";style="margin-right: 5px;"><输入类型=文本"id=搜索直到"类=SrchTwtr"；样式=宽度:100像素！重要的；margin-right: 5px;"><form id="form-searchLiveOrTop"><label for="searchLiveOrTop"></label><select id="searchLiveOrTop";名称=searchLiveOrTop"类=SrchTwtr"；style="width: 65px !Important;字体大小:0.85em ！重要；padding-left: 0px !Important;quot;><选项值="">顶部</option><option value="&f=live">最新</option><option value="&f=user">人物</option><option value="&f=image">照片</option><option value="&f=video">Videos</option></选择></表单>
在脚本中，我创建了一个函数来在发生任何更改时更新 srchTwtrClbrts:
var a = $("#searchSince").val(), b = $("#searchUntil").val(), c = $("#searchLiveOrTop").val();var srchTwtrClbrts = [{ url: "https://twitter/search?q= from:ddlovato 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:jtimberlake 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:selenagomez 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:ArianaGrande 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:taylorswift13 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:rihanna 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:katyperry 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:justinbieber 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},];$(".formChange").change(function () {var a = $("#searchSince").val(), b = $("#searchUntil").val(), c = $("#searchLiveOrTop").val();upadteUrL(a, b, c);});函数 upadteUrL(a, b, c) {srchTwtrClbrts = [{ url: "https://twitter/search?q= from:ddlovato 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:jtimberlake 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:selenagomez 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:ArianaGrande 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:taylorswift13 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:rihanna 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:katypery 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},{ url: "https://twitter/search?q= from:justinbieber 因为:"+ 一个 + "直到:"+ b + ""+ c + ""},];}$('#searchTwitterAccounts').click(function (searchTwitterAccounts) {for (var i = 0; i < srchTwtrClbrts.length; i++) {var order = Math.floor(Math.random() * 1000) + 1srchTwtrClbrts[i].order = order;}srchTwtrClbrts.sort(function (a, b) {返回(a.order - b.order)；})for (var i = 0; i < srchTwtrClbrts.length; i++) {window.open(srchTwtrClbrts[i].url);}})I'm trying to make one single JavaScript able to randomize several links which must be built with fragments taken from text fields, before opening each of them on its own tab, by clicking a button.
I know 2 different JavaScripts to separately do both things:
b) randomize several links before opening each of them on its own tab
But I can't find a working way to blend the 2 of them together in one single JavaScript.
I have tried several options to accomplish this, but I'm not an expert at all, so I keep failing and failing.
Wishing to make this post easier to be understood, I did a fiddle for it, but unfortunately links from fiddle are usually blocked on many websites, therefore I used w3schools pages instead, to make my example able to work properly:
https://www.w3schools/code/tryit.asp?filename=GT70R73WAL8A
My code so far is this:
var srchTwtrClbrts = [
{ url: "https://twitter/search?q= from:ddlovato since:"+a+" until:"+b+" "+c+" " },
{ url: "https://twitter/search?q= from:jtimberlake since:"+a+" until:"+b+" "+c+" " },
{ url: "https://twitter/search?q= from:selenagomez since:"+a+" until:"+b+" "+c+" " },
{ url: "https://twitter/search?q= from:ArianaGrande since:"+a+" until:"+b+" "+c+" " },
{ url: "https://twitter/search?q= from:taylorswift13 since:"+a+" until:"+b+" "+c+" " },
{ url: "https://twitter/search?q= from:rihanna since:"+a+" until:"+b+" "+c+" " },
{ url: "https://twitter/search?q= from:katyperry since:"+a+" until:"+b+" "+c+" " },
{ url: "https://twitter/search?q= from:justinbieber since:"+a+" until:"+b+" "+c+" " },
];
var a=$("#searchSince").val(),b=$("#searchUntil").val(),c=$("#searchLiveOrTop").val();
$('#searchTwitterAccounts').click(function(searchTwitterAccounts) {
for (var i = 0; i < srchTwtrClbrts.length; i++) {
var order = Math.floor(Math.random() * 1000) + 1
srchTwtrClbrts[i].order = order;
}
srchTwtrClbrts.sort(function (a, b) {
return (a.order - b.order);
})
for (var i = 0; i < srchTwtrClbrts.length; i++) {
window.open(srchTwtrClbrts[i].url);
}
})
At the w3schools page, you will need to click on Run » to watch the following:
and then choose the content for each of the 3 fields.
If it helps in anyway, I suspect my problem is not having this line correctly located:
var a=$("#searchSince").val(),b=$("#searchUntil").val(),c=$("#searchLiveOrTop").val();
as the resulting URLs keep saying "undefined"
I'm open to all suggestions, even to modify this script completely, so please feel free to suggest anything.
All suggestions are welcome as all of them help a lot.
Thank you in advance.
解决方案The problem is that when form data has been changed you never update the srchTwtrClbrts, So you need to listen to any change of text box and update the srchTwtrClbrts.
I add formChange class to main div and then listen to change of that:
<div class="formChange" name="searchCelebrities" id="searchCelebrities" style="display: flex; width: 400px; margin: 15px; height: 28px; text-align: center; border-radius: 5px; border: 1px gray dotted; background-color: #e2e2e2; padding: 5px 0 0 5px;">
<span style="position: relative; top: 1px; margin-right: 5px;">from:</span>
<form id="form-searchSince" style="margin-right: 5px;">
<input type="text" id="searchSince" class="SrchTwtr" style="width: 100px !important; margin-right: 5px;">
</form>
<span style="position: relative; top: 1px; margin-right: 5px;">until:</span>
<div id="form-searchUntil" style="margin-right: 5px;">
<input type="text" id="searchUntil" class="SrchTwtr" style="width: 100px !important; margin-right: 5px;">
</div>
<form id="form-searchLiveOrTop">
<label for="searchLiveOrTop"></label>
<select id="searchLiveOrTop" name="searchLiveOrTop" class="SrchTwtr" style="width: 65px !Important; font-size: 0.85em !Important; padding-left: 0px !Important;">
<option value=" ">Top</option>
<option value="&f=live">Latest</option>
<option value="&f=user">People</option>
<option value="&f=image">Photos</option>
<option value="&f=video">Videos</option>
</select>
</form>
</div>
And in script I create a function to update the srchTwtrClbrts when any changes happen:
var a = $("#searchSince").val(), b = $("#searchUntil").val(), c = $("#searchLiveOrTop").val();
var srchTwtrClbrts = [
{ url: "https://twitter/search?q= from:ddlovato since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:jtimberlake since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:selenagomez since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:ArianaGrande since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:taylorswift13 since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:rihanna since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:katyperry since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:justinbieber since:" + a + " until:" + b + " " + c + " " },
];
$(".formChange").change(function () {
var a = $("#searchSince").val(), b = $("#searchUntil").val(), c = $("#searchLiveOrTop").val();
upadteUrL(a, b, c);
});
function upadteUrL(a, b, c) {
srchTwtrClbrts = [
{ url: "https://twitter/search?q= from:ddlovato since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:jtimberlake since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:selenagomez since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:ArianaGrande since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:taylorswift13 since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:rihanna since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:katyperry since:" + a + " until:" + b + " " + c + " " },
{ url: "https://twitter/search?q= from:justinbieber since:" + a + " until:" + b + " " + c + " " },
];
}
$('#searchTwitterAccounts').click(function (searchTwitterAccounts) {
for (var i = 0; i < srchTwtrClbrts.length; i++) {
var order = Math.floor(Math.random() * 1000) + 1
srchTwtrClbrts[i].order = order;
}
srchTwtrClbrts.sort(function (a, b) {
return (a.order - b.order);
})
for (var i = 0; i < srchTwtrClbrts.length; i++) {
window.open(srchTwtrClbrts[i].url);
}
})
这篇关于如何使用取自文本字段的片段构建链接，但在 JavaScript 中将它们随机化，然后再在自己的选项卡上打开每个片段的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
更多推荐
[db:关键词]
发布评论