jquery：按鈕經歷下拉值並回到開頭

我有一個下拉列表。我想通過點擊按鈕來改變數值。所以它應該經歷所有的值直到最後，然後回到開始。jquery：按鈕經歷下拉值並回到開頭

也每次點擊按鈕，它應該改變innerHTML。

我不知道它是否可能。

所以這是我的下拉HTML：

<div id="masterChart_length" class="dataTables_length"> 
<label>Show 
<select size="1" name="masterChart_length" aria-controls="masterChart"> 
<option value="10" selected="selected">10</option> 
<option value="25">25</option> 
<option value="50">50</option> 
<option value="-1">All</option> 
</select> 
entries</label> 
</div>

這是HTML的按鈕使用方法：我發現這個職位Looping through selected values in multiple select combobox JQuery

<button type="button" id="change-dropdown" class="btn btn-primary pull-right">10</button>

但它會顯示所有使用此Jquery的值：

jQuery(function($) { 
    $('#change-dropdown').click(function() { 
     $('#masterChart_length > :selected').each(function() { 
      alert($(this).value()); // using text() here, because the 
     });       // options have no value..? 
    }); 
});

我正在使用Datatables，並且想要更改條目數下拉菜單的工作方式，只需點擊一下按鈕即可。

任何建議或幫助將不勝感激！

來源

2013-07-25 designtocode

jQuery(function($) { 
    $('#change-dropdown').click(function() {   
     $('#masterChart_length :selected').each(function() {    
      var curElement = $(this).text(); // using text() here, because the     
      var nextElement = $(this).next(); 
      var nextElementText = $.trim(nextElement.text()); 
      if(nextElementText!=''){ 
      $(curElement).removeAttr('selected'); 
      $(nextElement).attr('selected',true); 
      }else{ 
       //$(this).removeAttr('selected'); // reset here 
       $('#masterChart_length option:first-child').attr("selected", "selected"); 
      } 
     }); // options have no value..?  
     }); 
    });

更新了以下代碼更改答案，它也更改了文本按鈕

$(document).ready(function() { 
    jQuery(function($) { 
    $('#change-dropdown').click(function() { 
     var oSelectBoxName = '#masterChart_length'; 
     var oSelectBox = $(oSelectBoxName+' :selected'); 
     var curElement = oSelectBox.text(); // using text() here, because the     
     var nextElement = oSelectBox.next(); 

     var nextElementText = $.trim(nextElement.text()); 
     if(nextElementText!=''){ 
      $(this).html(nextElement.text()); 
      $(curElement).removeAttr('selected'); 
      $(nextElement).attr('selected',true); 
     }else{ 
      var ofirstElement = $(oSelectBoxName+' option:first-child'); 
      $(this).html(ofirstElement.text()); 
      ofirstElement.attr("selected", "selected");// reset here 
     }     
    }); 
});

}）;

來源

2013-07-25 09:02:36 Yogesh

你可以把它放在jsfiddle.net嗎？ – designtocode

請注意，''HTML'必須SELELECT'有'ID = 「masterChart_length」'它是目前在名稱屬性設置 – Yogesh

的jsfiddle鏈接[這裏]（http://jsfiddle.net/sBvjE/2/） – Yogesh

jQuery(function($) { 
$('#change-dropdown').click(function() { 
    $("#master_chartlength option:selected").removeAttr("selected").next().attr("selected","selected"); 
}); 
});

我以爲你想要的價值不斷變化（Next下一步後）每個按鈕被點擊

用於送回時間（如果需要的話），你可以添加條件

if($("#master_chartlength option:selected").is(":last-child")) 
    $("#master_chartlength option:first").attr("selected","selected");

來源

2013-07-25 08:56:39 rps

我似乎無法得到它的使用你的代碼在這撥弄工作：http://jsfiddle.net/eT2dJ/ – designtocode

@msbodetti從你選擇刪除'this'。這是因爲'select'實際上並不是'this'的子類。 – Puuskis

@Puuskis是的，我以後編輯過，首先我在select onchange上添加了這個事件，並選擇了（選項：selected，this），謝謝 – rps

$('#change-dropdown').click(function() { 
    var option = $("#masterChart_length option:selected"); 
    $(option).next().attr("selected","selected"); 
    $(option).removeAttr("selected"); 
});

來源

2013-07-25 09:07:32 EvilEpidemic

jquery：按鈕經歷下拉值並回到開頭

回答

相關問題