单击jquery移动选项卡时加载ajax项 - Load ajax item when click on jquery mobile tabs

Load ajax item when click on jquery mobile tabs

我想在jquery mobile中单击选项卡项时通过ajax加载一些内容。我该怎么做？

<div data-role="tabs" id="tabs">
  <div data-role="navbar">
    <ul>
      <li><a href="#one" data-ajax="false" data-icon="search" data-iconpos="right">Discover</a></li>
      <li><a href="#two" data-ajax="false" data-icon="home">My-chats</a></li>
    </ul>
  </div>
  <div id="one" class="ui-body-d ui-content">
    <div data-role="fieldcontain">
  <!--load data via ajax-->
</div>
  </div>
  <div id="two">
  <!--load data via ajax--> 
  </div>
</div>

当点击discover选项卡时，我想通过ajax将一些数据加载到该选项卡。如何做到这一点？

请帮帮我。

希望能帮助你！

(function(window, $) {
function TabCtrl() {
  var self = this;
  self.loadData = function(url) {
    return $
      .get(url)
    ;
  };
  $('[data-ajax]').click(function(event) {
    event.preventDefault();
    var tab = $(this).attr('href').replace('#', '');
    
    self
      .loadData(tab)
      .then(
        function(success) {},
        function(error) {}
      );
  });
}
$(document).ready(TabCtrl);
})(window, window.jQuery);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#my-custom-tab" data-ajax>Load Me</a>

试试这个。如果您已经在使用jQuery，那么忽略第一行。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript">
// Make sure all DOM is loaded
$(document).ready(function(){
    // Fired when you click the link
    $('#discover-tab').click(function(e){
        // Prevent the link from continuing it's normal action
        e.preventDefault();
        // Fetch the result of a URL
        $.get( "ajax/test.html", function( data ) {
            // Fill the DIV with ID of 'one' with that result
            $( "#one" ).html( data );
        });
    });
});
</script>

将其绑定到一个javascript函数，该函数执行如下ajax调用：

  <a href="javascript:ajaxcallfunction();">Discover</a>

javascript函数：

   function ajaxcallfunction(){
   window.location.href = window.location.href + "#one";
   //Enter your ajax call here
   }