我在单击List Item时尝试运行一些JQuery,但是在检入调试器时似乎没有触发click事件。
脚本是:
$(document.body).on('click', '.range', function (event) {
var rangeid = $(this).data('value');
var url2 = '/Home/GetMachineTypeByRange/-1';
url2 = url2.replace("-1", rangeid);
$.get(url2, function (data) {
$('#MachineTypeDropDown').html(data);
$('#MachineTypeDropDown').toggle();
});
});
我的HTML是:
<div class="button-group">
<button type="button" class="btn btn-default dropdown-toggle col-md-12" data-toggle="dropdown">Select a product category <span class="caret"></span></button>
<ul id="RangeDropDown" class="dropdown-menu col-md-12" data-url="/Home/GetRangeForCorp">
<li class="range" data-value="1"><a href="#" class="range" data-value="1" tabindex="-1">Articulated Dump Trucks</a></li>
...
</ul>
</div>
<div class="button-group" style="display: none;">
<button type="button" class="btn btn-default dropdown-toggle col-md-12" data-toggle="dropdown">Select a machine type <span class="caret"></span></button>
<ul style="display: none;" id="MachineTypeDropDown" class="dropdown-menu col-md-12"></ul>
</div>
答案 0 :(得分:0)
它应该有用
带有测试代码
$(document.body).on('click', '.range', function (event) {
alert("test");
});
看看这个小提琴
https://jsfiddle.net/d15czyt3/
我怀疑你的失败
答案 1 :(得分:0)
你的代码工作“很好”,问题应该是事件传播给它的父母......
这解决了它:
$(document.body).on('click', '.range', function (event) {
event.stopPropagation();//-> the event execute 1 time the code!
var rangeid = $(this).data('value');
var url2 = '/Home/GetMachineTypeByRange/-1';
url2 = url2.replace("-1", rangeid);
console.log(url2 + " | " +rangeid);
$.get(url2, function (data) {
$('#MachineTypeDropDown').html(data);
$('#MachineTypeDropDown').toggle();
});
});
event.stopPropagation() ,请检查url2是否正在获取您真正想要的网址(如果正确)并且您可能希望使用post而不是get,因为获得提高性能使用“网络缓存信息”