在按钮中使用 math.random 来设置 select 选项?
Using math.random in button to set a select option?
我正在尝试制作一个按钮,在单击时随机设置 select 选项。我不知道我做错了什么......
http://jsfiddle.net/GamerGorman20/nw8Ln6ha/25/
$('#rand').click(
function() {
randNum();
var num = "";
document.getElementById("mySelect").value.innerHTML = favWebComics[num];
});
var randNum = function() {
num = Math.round(Math.random() * 2) + 1;
return num;
};
显示的代码只是链接的 jsfiddle 中较大脚本的一小部分。
我计划稍后添加更多 select 离子,但我想在花时间处理这些之前弄清楚代码。
值得一提的是,我对此的理解非常有限,因此非常感谢保持简单的建议。
完成后需要更改的代码的相关部分如下所示(请参阅更新后的 jsfiddle):
$('#rand').click(function() {
var $select = document.getElementById('mySelect'),
max = $select.getElementsByTagName('option').length - 1;
$select.selectedIndex = randNum(1, max);
myFunction();
});
var randNum = function(min, max) {
num = Math.floor(Math.random() * (max - min + 1)) + min;
return num;
};
var myFunction = function() {
var x = document.getElementById("mySelect").value;
document.getElementById("demo").innerHTML = "You selected: " + x;
document.getElementById("image").innerHTML = favWebComics[x][1];
document.getElementById("web").innerHTML = favWebComics[x][0];
document.getElementById("tags").innerHTML = "Tags: " + favWebComics[x][2];
};
我没有改变你代码的风格或结构,只是改变了一些基本属性。
您遇到的问题是 innerHTML
。您不能在元素的 value
.
上设置 innerHTML
相反,您可以生成一个随机数并将 select
元素的 selectedIndex
属性 设置为该随机数。
然后,您将调用显示图像的函数以及您需要的其他内容。
您不能像这样将 select
更改为 innerHTML
:
document.getElementById("mySelect").value.innerHTML = favWebComics[num];
您必须改为更改值,然后像这样应用更改
$("#mySelect").val("New text").change();
或
$("#mySelect").prop('selectedIndex', index).change();
我正在尝试制作一个按钮,在单击时随机设置 select 选项。我不知道我做错了什么......
http://jsfiddle.net/GamerGorman20/nw8Ln6ha/25/
$('#rand').click(
function() {
randNum();
var num = "";
document.getElementById("mySelect").value.innerHTML = favWebComics[num];
});
var randNum = function() {
num = Math.round(Math.random() * 2) + 1;
return num;
};
显示的代码只是链接的 jsfiddle 中较大脚本的一小部分。
我计划稍后添加更多 select 离子,但我想在花时间处理这些之前弄清楚代码。
值得一提的是,我对此的理解非常有限,因此非常感谢保持简单的建议。
完成后需要更改的代码的相关部分如下所示(请参阅更新后的 jsfiddle):
$('#rand').click(function() {
var $select = document.getElementById('mySelect'),
max = $select.getElementsByTagName('option').length - 1;
$select.selectedIndex = randNum(1, max);
myFunction();
});
var randNum = function(min, max) {
num = Math.floor(Math.random() * (max - min + 1)) + min;
return num;
};
var myFunction = function() {
var x = document.getElementById("mySelect").value;
document.getElementById("demo").innerHTML = "You selected: " + x;
document.getElementById("image").innerHTML = favWebComics[x][1];
document.getElementById("web").innerHTML = favWebComics[x][0];
document.getElementById("tags").innerHTML = "Tags: " + favWebComics[x][2];
};
我没有改变你代码的风格或结构,只是改变了一些基本属性。
您遇到的问题是 innerHTML
。您不能在元素的 value
.
innerHTML
相反,您可以生成一个随机数并将 select
元素的 selectedIndex
属性 设置为该随机数。
然后,您将调用显示图像的函数以及您需要的其他内容。
您不能像这样将 select
更改为 innerHTML
:
document.getElementById("mySelect").value.innerHTML = favWebComics[num];
您必须改为更改值,然后像这样应用更改
$("#mySelect").val("New text").change();
或
$("#mySelect").prop('selectedIndex', index).change();