Question

我试图在表单中执行更改功能。

<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 - 但是当我设置其中一个复选框时，没有任何事情发生。

编辑：如果我删除课程＆＃34;我检查＆＃34;该函数被调用。为什么会这样？

我可以做任何错误吗？

Answer 1

           console.log("recieved data-------*\n\nResponse : " + response +"\n\nStatus : " + status);

$（ 'searchtable'）replaceWith（数据）;

添加此控制台语句并打开浏览器和监视控制台的开发工具。我怀疑它会被解雇，因为您已将其添加到表单中，因此不会注册更改。您可以向您添加一个类，例如class ='mycheckbox'

然后在jquery

$('.mycheckbox').click ...

之前添加文档。

表单功能未执行

1 个答案: