循環選擇框值

我想在選擇框中創建循環。但我想要一個不同的選擇代碼。我可以創建一個選擇，但我想要多個。循環選擇框值

我想改變這種根據代碼類或多個選擇。我給這家代碼：

<select class="foo"></select><select class="foo"></select>

和：

$(document).ready(function() { 
    var elm = document.getElementByClass('foo'), 
    df = document.createDocumentFragment(); 
    for (var i = 0; i <= 60; i++) { 
     var option = document.createElement('option'); 
     option.value = i; 
     option.appendChild(document.createTextNode(" " + i)); 
     df.appendChild(option); 
    } 
    elm.appendChild(df); 
});

來源

2013-12-18 user3102009

由於您使用jQuery的，所以你可以做這樣的：

The demo.

$('.foo').each(function() { 
    for (var i = 0; i <= 60; i++) { 
     $('<option />').val(i).html('#option ' + i).appendTo($(this)); 
    } 
});

來源

2013-12-18 07:24:54 xdazz

我想你想要的是

document.getElementsByClassName('foo');

http://jsfiddle.net/5J29g/48/

來源

2013-12-18 07:16:33 Andrew

它具有跨瀏覽器的問題你最好嘗試'document.querySelectorAll（「富」）; '而不是'getElementsByClassName'，我在我的答案中使用了它 –

試試這個：

$('.foo').each(function(){ 
    // call your code create option element here with $(this).append() 
});

來源

2013-12-18 07:16:47 HICURIN

您可以使用class selector與.append()沿和.clone()

$(document).ready(function() { 
    var df = document.createDocumentFragment(); 
    for (var i = 0; i <= 60; i++) { 
     var option = document.createElement('option'); 
     option.value = i; 
     option.appendChild(document.createTextNode(" " + i)); 
     df.appendChild(option); 
    } 
    $('.foo').append(function() { 
     return $(df).clone() 
    }) 
});

演示：Fiddle

來源

2013-12-18 07:22:14

我剛剛更新了你的jsfiddle添加此：

(function() { 
var foos=document.querySelectorAll(".foo"); 
for(var j=0;j<foos.length;j++){ 
    var elm = foos[j], 
     df = document.createDocumentFragment(); 
     for (var i = 1; i <= 42; i++) { 
      var option = document.createElement('option'); 
      option.value = i; 
      option.appendChild(document.createTextNode("option #" + i)); 
      df.appendChild(option); 
     } 
     elm.appendChild(df); 
    } 
}());

抽樣檢查出來，DEMO

來源

2013-12-18 07:27:01

循環選擇框值

回答

相關問題