-1

jQueryは私を嫌っています...テーブルに設定された画像のグループがあり、それぞれが下のdiv内に関連付けられたフォームを持っています...画像を「タブ」として利用して、これらのフォーム/divを切り替えられるようにしたい'、それでもうまくいかないようです。私がなんとかしたのは、最初ではないdivを非表示にすることだけです。これまでで最も基本的なことです。

jQueryを使用して変更しようとしているHTMLの例を次に示します。

<table id="publishimages">
  <tr>
    <td href="#tab-1">
      <img class="image1" src="randomsource1">
    </td>
    <td href="#tab-2">
      <img class="image2" src="randomsource2">
    </td>
 </tr>
</table>

<div id="desc">
  <div id="tab-1">
    Random description1
  </div>
  <div id="tab-2">
    Random description2
  </div>
</div>

ここに私のjQueryスクリプトがあります...

    $(document).ready(function() {
        $('#desc div').hide();
        $('#desc div:first').show();
        $('#desc td:first').addClass('active');

        $('#desc td img').click(function() {
            $('#desc td').removeClass('active');
            $(this).parent().addClass('active');
            var currentTab = $(this).parent().attr('href');
            $('#desc div').hide();
            $(currentTab).show();
            return false;

        });
    });

これについて何がひどく間違っているのですか？試行錯誤よりも効果的な JavaScript のデバッグ方法はありますか?

4

2 に答える 2

1

私はあなたのコードがここに欠けていると思います：

$('#desc td:first').addClass('active');

これは次のようになります。

$('#publishimages td:first').addClass('active');

そしてこれら：

$('#desc td img').click(function() {
        $('#desc td').removeClass('active');

する必要があります：

$('#publishimages td img').click(function() {
        $('#publishimages td').removeClass('active');
于 2013-02-26T11:19:15.843 に答える
1

こんにちは、コードを修正しました：

$(document).ready(function() { 
            $('#desc div').hide();              
            $('#desc div:first').show();                
            $('#publishimages td:first').addClass('active');        
            $('#publishimages td').click(function(){                    
                $('#publishimages td').removeClass('active');                   
                $(this).addClass('active');                 
                var currentTab = $(this).attr('href');                  
                $('#desc div').hide();                  
                $(currentTab).show();                   
                return false;
                });
    });

これは必要なことを行います。

于 2013-02-26T11:10:41.557 に答える