在输入变更时生成选项选择

<select id="gameid"> 
    //<option is a number 1-999> 
</select> 

<select id="netid"> 
    //<option is a number 1-999> 
</select> 

<select id="camp_id"> 
<script> 
var a = $("#gameid").val(); 
var b = $("#netid").val(); 
var c = a+b; 

for (var i = 1; i<=999; i++) 
    { 
     document.write("<option value='"+c+i+"'>"+c+i+"</option>"); 
    } 
</script> 
</select>

上面的代码是为选择生成一些选项。在输入变更时生成选项选择

我想要做的是，如果#gameid中的val被更改，选项列表也会改变，对于#netid也是如此。

但是，该选项不会更改。它保持在#gameid和#netid的默认值。

我不知道我在这里失踪。我需要帮助。

[UPDATE]

此代码几乎工作。但是，当我在选择完所有的#cameid后再进行第二次更改时，它不再更改#campid选择。如果我在#netid上做了更改，它会再次更改它。

$("#gameid" && "#netid").on('change', function(){ 
    a = $("#gameid").val(), 
    b = $("#netid").val(), 
    c = a+b; 
    $("#camp_id").empty(); 

    for (var i = 1; i<=999; i++){ 
    $("#camp_id").append("<option value='"+(c+i)+"'>"+(c+i)+"</option>"); 
    } 
});

来源

2015-04-23 iyal

什么是游戏ID和网络标识符号，它们是输入或选择框？请分享一些相关的html代码 –

他们也是选择选项。 – iyal

你是什么意思，@iyal？ – Vikrant

使用更改事件

$('#gameid,#netid').on('change',function(){ 
var a = $("#gameid").val(); 
var b = $("#netid").val(); 
    alert($(this).attr('id')); 
var c = parseInt(a)+parseInt(b); 

if ($(this).attr('id') == 'gameid') { 
    $el = $("#netid");} else {$el = $("#gameid")}; 
$el.text(''); 
for (var i = 1; i<=999; i++) 
    { 
     $el.append("<option value='"+(c+i)+"'>"+(c+i)+"</option>"); 
    } 
});

注：我用jQuery的，的jsfiddle：https://jsfiddle.net/1zgre9pw/4/

来源

2015-04-23 05:19:02 madalinivascu

第一行有错误，那是什么？ – iyal

它可以改变数值，但是它只打印选项值，我的所有html代码都不见了？ – iyal

已更新我的代码 – madalinivascu

使用这样的事情：

var options = ''; 
for (var i = 1; i<=999; i++) 
{ 
    options += "<option value='"+c+i+"'>"+c+i+"</option>"; 
} 
document.getElementById('camp_id').innerHTML = options;

使用类似于插入选项，其他选择如果需要的话盒子

来源

2015-04-23 05:19:24

正如您想动态添加选项到HTML select。我试图用jquery来实现，即致电$('#gameid').populate();。

首先，加入jQuery库在页面<head>：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>`

WORKING DEMO

$.fn.populate = function() { 
    var $this = $(this); 

    for (var i = 1; i<=999; i++){ 
     $this.append("<option value='"+(c+i)+"'>"+(c+i)+"</option>"); 
    } 
}  
$('#gameid').populate();

您可以添加同为第二select（下拉）为好。

来源

2015-04-23 05:19:27 Vikrant

@iyal，是否适合您？ – Vikrant

不要忘记添加jQuery库，

<select id="gameid" onchange="generateOptions();"> 
    <!-- Your Options --> 
</select> 

<select id="netid" onchange="generateOptions();"> 
<!-- Your Options --> 
</select> 

<select id="camp_id"> 

</select> 


    <script type="text/javascript"> 
var a,b,c,str=""; 



    function generateOptions() 
    { 
     a = $("#gameid").val(); 
     b = $("#netid").val(); 
     c = a+b; 
     for (var i = 1; i<=999; i++) 
     { 
     str= str + "<option value='"+c+i+"'>"+c+i+"</option>"; 
     } 
     $('#camp_id').html(str); 
    } 

    </script>

来源

2015-04-23 05:25:27

var a = $("#gameid").val(), 
b = $("#netid").val(), 
c; 

$("#gameid").change(function(){ 
    a = $(this).val(); 
    c = parseInt(a)+parseInt(b); 
    $("#camp_id").empty(); 

    for (var i = 1; i<=999; i++){ 
    $("#camp_id").append("<option value='"+(c+i)+"'>"+(c+i)+"</option>"); 
    } 
});

https://jsfiddle.net/partypete25/j9toh39c/

来源

2015-04-23 05:31:42 partypete25

这一个几乎达到我想要的。但是，它在更改时不会更改/添加'var b'的值。 – iyal

看我的更新代码，我修改你的。 – iyal

添加netid到变化功能 https://jsfiddle.net/partypete25/j9toh39c/2/ – partypete25

在输入变更时生成选项选择

回答

相关问题