使用jquery </select>触发更改事件<select>

时间:2012-05-11 08:00:19

标签: jquery

无论如何我可以在页面加载的选择框上触发更改事件并选择一个特定选项。

此功能也是通过在将函数绑定到事件后添加触发器来执行的。

我试图输出类似this

的内容
<select class="check">
<option value="one">one</option>
<option value="two">two</option>
</select>

$(function(){
    $('.check').trigger('change'); //This event will fire the change event. 
    $('.check').change(function(){
      var data= $(this).val();
      alert(data);            
    });
});

http://jsfiddle.net/v7QWd/1/

8 个答案:

答案 0 :(得分:221)

使用val()更改为(不是文本)和trigger()以手动触发事件。

必须在触发器之前声明更改事件处理程序。

Here's a sample

$('.check').change(function(){
  var data= $(this).val();
  alert(data);            
});

$('.check')
    .val('two')
    .trigger('change');

答案 1 :(得分:23)

要选择选项,请在select元素上使用.val('value-of-the-option')。要触发更改元素,请使用.change().trigger('change')

代码中的问题是逗号而不是$('.check'),trigger('change');中的点,以及在绑定事件处理程序之前调用它的事实。

答案 2 :(得分:9)

$('#edit_user_details').find('select').trigger('change');

它会使用id="edit_user_details"更改选择 html标记下拉项。

答案 3 :(得分:1)

提供选项标记

的值中的链接
<select size="1" name="links" onchange="window.location.href=this.value;">
   <option value="http://www.google.com">Google</option>
   <option value="http://www.yahoo.com">Yahoo</option>
</select>

答案 4 :(得分:1)

如果你想做一些检查,那就用这种方式

 <select size="1" name="links" onchange="functionToTriggerClick(this.value)">
    <option value="">Select a Search Engine</option>        
    <option value="http://www.google.com">Google</option>
    <option value="http://www.yahoo.com">Yahoo</option>
</select>

<script>

   function functionToTriggerClick(link) {

     if(link != ''){
        window.location.href=link;
        }
    }  

</script>

答案 5 :(得分:0)

对于那些被jQuery触发处理程序阻止的人来说,另一种可行的解决方案是,对本机事件的触发将如下所示(100%工作):

var sortBySelect = document.querySelector("select.your-class"); 
sortBySelect.value = "new value"; 
sortBySelect.dispatchEvent(new Event("change"));

答案 6 :(得分:0)

基于Mohamed23gharbi的回答:

function change(selector, value) {
    var sortBySelect = document.querySelector(selector);
    sortBySelect.value = value;
    sortBySelect.dispatchEvent(new Event("change"));
}

function click(selector) {
    var sortBySelect = document.querySelector(selector);
    sortBySelect.dispatchEvent(new Event("click"));
}

function test() {
    change("select#MySelect", 19);
    click("button#MyButton");
    click("a#MyLink");
}

就我而言,元素是由vue创建的,这是唯一可行的方法。

答案 7 :(得分:0)

您可以尝试下面的代码来解决您的问题:

默认情况下,第一个选项选择: jQuery('。select')。find('option')[0] .selected = true;

谢谢, Ketan T