0

我是 jQuery 的绝对菜鸟,并且在前端开发方面非常糟糕,所以这是我的问题。

使用以下 HTML

<select id="event_category_id" name="event_category_id">
  <option value="">Select Category</option>
  <option value="1">Category One</option>
  <option value="2">Category Two</option>
  <option value="3">Category Three</option>
</select>

以及下面的 jQuery

$(document).ready(function() {
  // commands go here
  $('#event_category_id option').click( function(e) { 
    // e.stopImmediatePropagation();
    alert( $('#event_category_id option:selected').text() ); 
   });
});

一键显示两次警报,每次都显示正确的选择文本。通过取消注释 stopImmediatePropagation 来纠正它。

所以我的问题是,如果这是事件冒泡/捕获,由于选择没有文本,只有选项,因此其中一个警报不会是空白的。

还是我认为所有这些工作方式都在错误的轨道上?

谢谢你的时间。

4

3 回答 3

1

不要使用该click事件。请改用change事件。

$(document).ready(function() {  
   $('#event_category_id').change( function(e) { 
     alert( $(this).children('option:selected').text() ); 
   });
});

参考:变化

于 2010-07-01T08:46:53.433 回答
0

尝试...

$('#event_category_id').change( function(e) {    
   alert( $(this).find(':selected').text() ); 
});

玩演示

于 2010-07-01T08:45:59.057 回答
0

试图将事件的冒泡解释为一个广泛的话题。

事件对象提供 .stopPropagation() 方法,该方法可以完全停止事件的冒泡过程。此方法是纯 JavaScript 功能,但不能在所有浏览器中安全使用。但是,如果所有事件处理程序都使用 jQuery 正确注册,则可以使用该方法。

stopPropagation 防止当前以外的任何对象接收事件,这可以在事件的任何阶段内。stopImmediatePropagation 做同样的事情,但也采取了额外的步骤来防止当前目标中的其他事件也接收事件发生。

默认操作

当使用具有默认操作的元素时,例如在单击时具有重定向的默认操作。类似地,当用户在编辑表单时按下 Enter 键时,会在表单上触发提交事件,但随后表单提交实际上是在此之后发生的。

如果不需要这些默认操作,则在事件上调用 .stopPropagation() 将无济于事。这些动作在事件传播的正常​​流程中不会发生。相反, .preventDefault() 方法将用于在触发默认操作之前停止事件。

要停止冒泡和默认操作,即调用 .stopPropogation() 和 .preventDefault() 方法,您只需return false;

于 2010-07-01T08:58:09.093 回答