jQuery回調遇到麻煩

Question

我在html中有一個手風琴，標題onclick調用了一個函數initTable。

<script type="text/javascript">
  $(document).ready(function() 
  {
    $('.accordion ul li h1').click(function() 
    {                
      document.getElementById('processing').innerHTML = "Processing...";
      document.body.style.cursor = 'Wait';
      $(this).parent().parent().find('.ac:visible').slideToggle().parent().removeClass('active');

      if ($(this).next().is(':hidden'))
      {
        $(this).next().slideToggle().parent().addClass('active'); 
      }
    });
  } );
  </script>
</head>
<body>
  <div id=processing></div>
  <div class="wrapper">
    <div class="accordion">
      <ul>
        <li>
          <h1 onclick=initTable("Anticoag")>Anticoag</h1>
          <div class="ac">
            <div id="AnticoagTable" width="100%">Loading...</div>
          </div>
        </li>

initTable命中服務器以獲取數據並創建一個DataTable，這需要幾秒鍾。

我想做的是在進行initTable調用之前將div id ='processing'設置為“ Processing ...”。

現在發生的事情是它正在等待表數據返回，然后顯示“正在處理...”

我嘗試使用此代碼將h1更改為onclick = test1（category）。 但是由於某種原因，我的initTable函數甚至沒有被調用。 不知道這是語法還是我完全錯誤地使用它。

function test1(category)
{
  test2(category, function()
  {
    initTable(category);
  });
}

function test2(category)
{
  alert("test2");
  document.getElementById('processing').innerHTML = "Processing...";
  document.body.style.cursor = 'Wait';
}

通過請求函數initTable（category）{如果（gsCategory ===“”）gsCategory = category添加initTable函數 否則if（gsCategory == category）gbToggle =！gbToggle; 否則gbToggle = false;

    gsCategory = category;

    if (gbToggle === false) {
        gsCategory = category;

        var select = document.forms[0].selFacility;
        var facility = select.options[select.selectedIndex].value;

        var patJson = getJson(facility, category);
        document.getElementById('processing').innerHTML = "Done...";
        document.body.style.cursor = 'Default';
        var anOpen = [];
        var sImageUrl = "../images/";
        makeTable(category);

        var oTable = $('#' + category).dataTable({
            "bProcessing": false,
                "bDestroy": true,
                "aaData": patJson,
                "bAutoWidth": false,
                "aoColumns": [{
                "mDataProp": null,
                    "sClass": "control center",
                    "sDefaultContent": '<img src="' + sImageUrl + 'details_open.png' + '">',
                    "sWidth": "5%"
            }, {
                "mDataProp": "S_PAT_NAME",
                    "sWidth": "30%"
            }, {
                "mDataProp": "S_AGE",
                    "sWidth": "15%"
            }, {
                "mDataProp": "S_FIN",
                    "sWidth": "30%"
            }, {
                "mDataProp": "S_ROOM_BED",
                    "sWidth": "20%"
            }]
        });

        $('#' + category + ' td.control').live('click', function () {
            var nTr = this.parentNode;
            var i = $.inArray(nTr, anOpen);

            if (i === -1) {
                $('img', this).attr('src', sImageUrl + "details_close.png");
                var nDetailsRow = oTable.fnOpen(nTr, fnFormatDetails(oTable, nTr), 'details');
                $('div.innerDetails', nDetailsRow).slideDown();
                anOpen.push(nTr);
            } else {
                $('img', this).attr('src', sImageUrl + "details_open.png");
                $('div.innerDetails', $(nTr).next()[0]).slideUp(function () {
                    oTable.fnClose(nTr);
                    anOpen.splice(i, 1);
                });
            }
        });
    } //gbToggle = false
}

Answer 1

您已經分配了使用jQuery單擊的功能，不需要並且不應該使用onclick屬性

只需將initTable調用放入點擊處理程序函數中即可。 要識別點擊的內容，您可以使用data-something屬性

$(document).ready(function()  {
  $('.accordion ul li h1').click(function()  {  
  var category = $(this).attr('data-category');

  $('#processing')..text("Processing...");
  ...
  initTable( category );



<h1 data-category="Anticoag">Anticoag</h1>

您還需要：

知道在javascript中將{放在新行中是不正確的
了解將內聯函數傳遞給其他函數時會發生什么情況，因為
test2（category，function（）{initTable（category）;}）;

而且您甚至沒有在test2函數定義中聲明第二個參數。

Answer 2

您的initTable(category)不會被調用。

test2應該是：

 function test2(category,cb){
  alert("test2");
  document.getElementById('processing').innerHTML = "Processing...";
  document.body.style.cursor = 'Wait';
  //Calling the call-back
  cb(category);
 }

這是您的實際代碼。 但您可以在test1簡單地做test1

function test1(category)
{
  test2(category);

  //asynchronous call to initTable().
  setTimeout(function(){
      initTable(category);
  },0);
}

jQuery回調遇到麻煩

問題描述

2 個解決方案

解決方案1
1 2013-02-10 19:47:21

解決方案2
0 已采納 2013-02-10 19:41:57

jQuery回調遇到麻煩

問題描述

2 個解決方案

解決方案1 1 2013-02-10 19:47:21

解決方案2 0 已采納 2013-02-10 19:41:57

解決方案1
1 2013-02-10 19:47:21

解決方案2
0 已采納 2013-02-10 19:41:57