Javascript 表单函数未执行
我试图在表单中的更改上执行函数Javascript 表单函数未执行,javascript,jquery,html,Javascript,Jquery,Html,我试图在表单中的更改上执行函数 <ul class="list booking-filters-list"> <li> <h5 class="booking-filters-title">Price</h5> <input type="text" id="price-slider"> </li> <li>
<ul class="list booking-filters-list">
<li>
<h5 class="booking-filters-title">Price</h5>
<input type="text" id="price-slider">
</li>
<li>
<h5 class="booking-filters-title">Star Rating</h5>
<form id="hotelRating" name="hotelRating" onchange="filterBy()">
<div class="checkbox">
<label>
<input class="i-check" type="checkbox" name="5" value="5.0" />5 star</label>
</div>
<div class="checkbox">
<label>
<input class="i-check" type="checkbox" name="4" value="4.0" />4 star</label>
</div>
<div class="checkbox">
<label>
<input class="i-check" type="checkbox" name="3" value="3.0" />3 star</label>
</div>
<div class="checkbox">
<label>
<input class="i-check" type="checkbox" name="2" value="2.0" />2 star</label>
</div>
<div class="checkbox">
<label>
<input class="i-check" type="checkbox" name="1" value="1.0" />1 star</label>
</div>
</form>
</li>
</ul>
脚本函数:
<script>
function filterBy() {
$('.searchtable').addClass('hide');
$('.spinner').removeClass('hide');
$.ajax({
type: 'GET',
data: {'name':'<?php echo strval($_GET['name']); ?>','arrival':'<?php echo strval($_GET['arrival']); ?>','departure':'<?php echo strval($_GET['departure']);?>','guests':'<?php echo strval($_GET['guests']);?>','propertyCategory':$("#hotelType input[type='checkbox']:checked").val(),'minStarRating':$("#hotelRating input[type='checkbox']:checked").val(),'order_by':$('#order_by').val()},
url: '<?php echo $baseUrl ?>/hotels/hotelFilterResult.php',
success: function (data) {
alert('data loaded succesfully');
alert(this.url);
$('.searchtable').replaceWith(data);
$('.spinner').addClass('hide');
$('.searchtable').removeClass('hide');
},
error: function (xhr) {
alert('data not loaded');
}
});
}
</script>
我已经将函数filterBy设置为在表单中执行onchange-wihtin,但是当我设置其中一个复选框时,什么也没有发生
编辑:如果我删除了类I-check,则调用该函数。为什么会这样 谁能看出我做错了什么
console.log("recieved data-------*\n\nResponse : " + response +"\n\nStatus : " + status);
$'.searchtable'.replaceWithdata
添加此控制台语句并打开浏览器和监视控制台的开发工具。我怀疑它会被解雇,因为您已将其添加到表单中,因此更改不会被注册。您可以向复选框中添加一个类,如class='mycheckbox'
然后在jquery中
$('.mycheckbox').click ...
添加之前准备好的文档 你的电话成功了吗?当函数执行时,您的控制台会说什么?通常,您会在可变元素(如实际复选框)上放置一个onchange,我不确定它是否适用于整个表单。顺便说一句,您可能在回显$\u GET变量的位置有一个反映的XSS漏洞@TaryEast更改事件应该是气泡。在输出和查看控制台之前添加类似的内容。console.log接收到的数据---*\n\n响应:+response+\n\n状态:+status;看看数据是否正在发送。在你被…取代之前。HTML我发现在保存容器时更有用。当元素的值更改时,更改事件将被发送到元素。此事件仅限于元素、框和元素。如果我删除类I-check,该函数将工作。不知道为什么-@creaven你检查控制台了吗?它可能会告诉你为什么?