javascript - Jquery点击事件大于按钮

Question

我在使用 Jquery 单击事件时遇到了一些问题。当我单击按钮时该事件会触发，但当我单击按钮的一侧时它也会触发，这会对我正在构建的应用程序产生不良影响。我在下面包含了一个 JSFiddle，它演示了这个问题。如果您单击“下一步”按钮右侧的事件仍会触发。此外，如果您删除 javascript，此行为就会消失。

JSFiddle

Javascript 如下所示:

$(function() {

$(" #sortable ").sortable({axis: "x", containment: "window"});
$( ".clicked" ).click( function() {

   var sortedIDs = $( "#sortable" ).sortable( "toArray", {attribute: 'custom-cl'} );
   alert(sortedIDs);

   var target = "http://localhost:3000/langs";

   $.ajax({
     type: 'get',
     url: target + '?order='+sortedIDs.join(',') ,
     dataType: 'script'
   }); 
});     
});

关于如何解决这个问题并在按钮中包含点击事件有什么想法吗？

提前感谢您的帮助!

Answer 1

那是因为您的点击处理程序设置在包含按钮的 div 上。如果您只想将它​​用于按钮元素，请为其指定一个 ID 并将其设置为该元素。

<div class="clicked"><button id="next" type="button">Next</button></div>

$('#next').click(function(){..});