[英]Blur event triggering first before click event triggers in JavaScript
我正在尝试在模糊事件中扩展面板并在单击中调用其他代码。 但是点击事件不会被触发,只有触发模糊事件会被触发。
要进行复制,请转到小提琴并在输入框中键入一些文本,然后单击“测试”按钮。
HTML:
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<div id="accordion">
<h3>Section 1</h3>
<div>
<input type="text" />
<p>
Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
</p>
</div>
<h3>Section 2</h3>
<div>
<p>
Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
suscipit faucibus urna.
</p>
</div>
<h3>Section 3</h3>
<div>
<p>
Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
</p>
<ul>
<li>List item one</li>
<li>List item two</li>
<li>List item three</li>
</ul>
</div>
<h3>Section 4</h3>
<div>
<p>
Cras dictum. Pellentesque habitant morbi tristique senectus et netus
et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
mauris vel est.
</p>
<p>
Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus.
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per
inceptos himenaeos.
</p>
</div>
</div>
<input type="button" value="test" id="test" />
JavaScript的:
$(function() {
$( "#accordion" ).accordion();
$("#test").on("click", function() {
alert("Click event triggered");
});
$("input").on("blur", function() {
$('#accordion .ui-accordion-content').show();
});
});
您可以在此处检查JSFiddle: http : //jsfiddle.net/ranjitsachin/zbrntv2r/3/
注意:我发现了一些非标准的替代解决方案,例如,我们可以使用onmousedown代替click event。
另外,我不想在点击事件中调用模糊事件。
在点击事件之前添加此选项,以防止发生模糊事件。
$("#test").on("mouseover", function(evt) { evt.preventDefault(); });
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.