一旦加载内容就处理jquery Ajax选项卡加载内容

我加载选项卡异步使用Jquery AJAX选项卡我想加载一个选项卡只有一次点击，但它加载选项卡上每次点击导致回发因此重置用户的选择。我如何防止重新加载标签？一旦加载内容就处理jquery Ajax选项卡加载内容

 <div id="tabs"> 
      <ul> 
       <li><a id="a" href="xyz.aspx">a</a> </li> 
       <li><a id="b" href="abc.aspx">b</a> </li> 
       <li><a id="c" href="">c</a> </li> 
       <li><a id="d" href="">d</a> </li> 
      </ul> 
     </div> 


$(function() { 
      $("#tabs").tabs({ 
       beforeLoad: function (event, ui) { 
        ui.jqXHR.error(function() { 
         ui.panel.html(""); 

        }); 
        // ui.ajaxSettings.async = false;    //does not work 

       } 
       //cache:true   // does not help 
      }); 
     });

来源

2013-01-22 Tuscan

我不熟悉.tabs但如果我明白你说什么让我们假设你有一组你希望他们只有当他们获得点击

<div class="tabs" data-href="loaded" id="1"> 
     <ul> 
      <li><a id="a" href="xyz.aspx">a</a> </li> 
      <li><a id="b" href="abc.aspx">b</a> </li> 
      <li><a id="c" href="">c</a> </li> 
      <li><a id="d" href="">d</a> </li> 
     </ul> 
    </div> 

    <div class="tabs" data-href="loaded" id="2"> 
     <ul> 
      <li><a id="aa" href="xyz.aspx">a</a> </li> 
      <li><a id="bb" href="abc.aspx">b</a> </li> 
      <li><a id="cc" href="">c</a> </li> 
      <li><a id="dd" href="">d</a> </li> 
     </ul> 
    </div> 

    <div class="tabs" data-href="loaded" id="3"> 
     <ul> 
      <li><a id="aaa" href="xyz.aspx">a</a> </li> 
      <li><a id="bbb" href="abc.aspx">b</a> </li> 
      <li><a id="ccc" href="">c</a> </li> 
      <li><a id="ddd" href="">d</a> </li> 
     </ul> 
    </div>

一次加载标签文档准备就绪时分配单击事件处理程序，以便无论何时单击选项卡，都会验证并处理请求。

$(document).ready(function(){ 
    $('.tabs').click(function(){ 
    if($(this).attr('data-href') != 'loaded') 
    { 
     new tabRequest($(this).attr('id')); 
    } 
    }) 
})

这是该请求。（我们通过ID的情况下，要验证什么加载服务器端）

function tabRequest(id){ 

     var request = $.ajax({ 
      url: "/fetch_tabs.php", 
      type: "POST", 
      data: { 
       'tabID': id, 
       }, 
      dataType: "json" 
     }) 

     request.done(function(msg) 
     { 
      $('#'+id).attr('data-href', loaded); 
      $('#'+id).html('msg'); 
     }) 

     request.fail(function(jqXHR, textStatus) { 
      console.log(textStatus); 
      console.log(jqXHR); 
     }) 

     request.complete(function(){ 
      console.log("Ajax request complete!"); 
     }) 

}

希望这有助于:)

来源

2013-01-22 11:10:14 Syd

$(function() { 
$("#tabs").tabs({ 
    beforeLoad: function (event, ui) { 
     if (ui.tab.data("loaded")) { 
      event.preventDefault(); 
      return; 
     } 
     //ui.ajaxSettings.cache = false, 
     ui.panel.html('<img src="images/loader.gif" width="24" height="24" style="vertical-align:middle;"> Loading...'), 
     ui.jqXHR.success(function() { 
      ui.tab.data("loaded", true); 
     }), 
     ui.jqXHR.error(function() { 
      ui.panel.html(
      "Please Reload Page or Try Again Later."); 
     }); 
    } 
});

}） ;

来源

2017-03-27 12:00:48

一旦加载内容就处理jquery Ajax选项卡加载内容

回答

相关问题