jQuery 运行同时加载页面

Question

我需要你的帮助。我有一个 jquery 代码，它在我第一次加载页面后运行良好，作为第二步检查复选框。在后台函数 updateSg(opts) 中调用 submit.php 结果 Json.

但我想解决打开页面时，checkbox input标签从URL获取checked值，checkbox被选中但jquery代码不是[=26] =].我必须取消选中并再次检查代码运行ning.

你能帮我看看代码是和页面加载一起执行的吗？

谢谢，姿态

<div id="result"></div>
<div id="filter">
  <h2>Filter</h2>
  <div>
    <input type="checkbox" id="sg" name="sg" checked>
    <label for="sg">Something</label>
  </div>
</div>
<script src="http://code.jquery.com/jquery-latest.js"></script> 

<script>
  var getsg = "something";

  function makeTable(data){
       var tbl_body = "";
       $.each(data, function(k,v) {
         tbl_body += getsg;
       })
       return tbl_body;
  }

  function getSgFilterOptions(){
    var opts = [];
    $checkboxes.each(function(){
      if(this.checked){
        opts.push(this.name);
      }
    });
    return opts;
  }

  function updateSg(opts){
    $.ajax({
      type: "POST",
      url: "submit.php",
      dataType : 'json',
      cache: false,
      data: {filterOpts: opts},
      success: function(records){
        $('div#result').html(makeTable(records));
      }
    });
  }

  var $checkboxes = $("input:checkbox");
  $checkboxes.on("change", function(){
    var opts = getSgFilterOptions();
    updateSg(opts);
  });

  updateSg();

  </script>

Answer 1

您应该首先检查复选框是否被选中。

接下来，当您的页面加载时，您的 updateSg() 函数不为 ajax 提供 postData（因此 filterOpts 为空）。

试试这个：

<script>
  var getsg = "something";
  var $checkboxes = $("input:checkbox");

  function makeTable(data){
      var tbl_body = "";
      $.each(data, function(k,v) {
          tbl_body += getsg;
      });
      return tbl_body;
  }  

  function callAjax(opts){
      $.ajax({
          type: "POST",
          url: "submit.php",
          dataType : 'json',
          cache: false,
          data: {filterOpts: opts},
          success: function(records){
              $('div#result').html(makeTable(records));
          }
      });
  }

  $checkboxes.on("change", function(){
      getSgFilterOptions();
  });

  function getSgFilterOptions(){
      if($checkboxes.length){
          var opts = [];
          $checkboxes.each(function(){
              if(this.checked){
                  opts.push(this.name);
              }
          });
          callAjax(opts);
      }
  }

  getSgFilterOptions();

</script>

jQuery 运行 同时加载页面

jQuery running at the same time when page loading

php

checkbox

jquery

jQuery 运行同时加载页面