0

content.html の 1 div (#tabs-1、#tabs-2) だけを .load() しようとしていますが、クラス .button をクリックするとすべてのページが読み込まれます。

<li><a class="button" id="tabs-1" >Option 1</a></li> 
<li><a class="button" id="tabs-2">Option 2</a></li>

<div id="container"></div>

$('.button').click(function() {
    var id = $('this').attr('id');
    var url = "content.html#";
    $('#container').html(" ");
    $('#container').load(url + id);
});

content.html

<div id="tabs-1">
   CONTENT 1 CONTENT 1  CONTENT 1  
</div>

<div id="tabs-2">
   CONTENT 2 CONTENT 2 CONTENT 2  
</div>
4

4 に答える 4

1

クリックされた要素のIDを取得するには、を使用できます。次のようなthis.idタグを持つ要素のIDを取得しようとしていますthis<this id="x">..</this>

$('.button').click(function () {
    var url = "content.html #"
    $('#container').html("").load(url + this.id);
});
于 2013-10-10T07:31:54.727 に答える
0 
var html1='';
var html2='';

html1='<div class="tabs-1">CONTENT 1 CONTENT 1  CONTENT 1  </div>';
html2='<div class="tabs-2">CONTENT 2 CONTENT 2 CONTENT 2  </div>';

$('.button').click(function () {
        var id = $(this).attr("id");
        if(id == "tabs-1"){
         var html = html1;
        }else{
         var html = html2;
        }
        $('#container').html("");
        $('#container').html(html);
    });

IDは常に一意であるため、IDを変更しました。

于 2013-10-10T07:34:53.337 に答える
0

「これ」をこれのみに変更し、 preventDefaultlikeを使用します

$('.button').click(function(e) {
   e.preventDefault();// preventing default working
   var id = $(this).attr('id');// this instead of 'this'
   //var id = this.id; // you can use it simply using core javascript
   var url = "content.html#";
   //$('#container').html(" "); //no need to do this
   $('#container').load(url + id);// load will remove previous data
});
于 2013-10-10T07:31:27.740 に答える
0

以下のようになります:-

 $('.button').click(function() {
    var id = $(this).attr('id');
    var url = 'content.html("#';
    $('#container').html(" ");
    $('#container').load(url + id + '")');

  });
于 2013-10-10T07:29:37.707 に答える