0

前の質問を基に、

jqueryボタンに2つのことを同時に実行させることは可能ですか？今私はこれを持っています：

<td>
 <a href="#'.$row['abstractid'].'">
   <button onClick="$(\'.hide\').toggle();">Read Abstract
   </button>
 </a>
</td>

これは機能します（イェーイ！）-そのデータベースID番号で非表示になっているdivにジャンプして表示します-しかし、これらの結果はループされているため、すべてが表示されます。これで、ページの正しい場所に移動しますが、1つの結果だけでなく、すべての結果が表示されます。

このボタンをonClickにすると、非表示が切り替わるだけでなく、クエリのデータベースID番号が設定され、結果の1つのセットのみが表示されます。または、その1つのデータベースIDセットのみが表示され、他のデータベースIDセットは非表示のままになりますか？テーブルIDをデータベースIDとして設定し、それをdivに入れるのではなく、hiddenのクラスを指定する必要がありますか？

例：現在は次のとおりです。

<div id="'.$row['abstractid'].'" style="display:none;" class="hide">
<table>
stuff
</table>

しかし、私はそれを作る必要がありますか

<table id="'.$row['abstractid'].'" style="display:none;" class="hide">

代わりは？これは理論的には理にかなっていますが、CSSを少し工夫する必要があると思います。

4

2 に答える 2

2

あなたが使用することができます onclick="function() {$(\'.hide\').toggle();$(\'.hide\').toggle();}"

しかし、私はそれをお勧めしません。私の提案は次のとおりです。

<button class="read-abstract">Read Abstract</button>

それで

<script>
$(document).ready( function() {
    $(".read-abstract").live( "click", function() {
        // do stuff here
    });
}
</script>

目立たない Javascript の詳細については、http: //en.wikipedia.org/wiki/Unobtrusive_JavaScriptを参照してください。

値の表示と非表示に関して、私は常に次のようにアプローチします。

HTML:

<button data-hide-id="1" class="read-abstract">Read Abstract</button>
<table id="table-1" class="hide">
    <tr>
        <td>Contents will show hide on click of read abstract</td>
    </tr>
</table>

JS (で<head>):

<script type="text/javascript">
$(document).ready( function() {
    $(".read-abstract").live( "click", function() {
        $("#table-" + $(this).data("hide-id") ).toggle();
    });
}
</script>

作業例: http://jsfiddle.net/sZREt/

于 2012-08-22T14:58:09.393 に答える
0
  1. 特定のアイテムだけでなく、クラス「非表示」ですべてのアイテムを切り替えます
  2. ボタンをアンカーに配置する必要はありません (許可されているかどうかもわかりません)。ボタンのように見せる必要がある場合は、CSS を使用できます。
  3. ID は、数字ではなく文字で始める必要があります。あなたは数字だと思うabstractidので、先頭に追加しましたabstr
  4. 要素にクラスを与える場合hide(おそらくそれを非表示にします)、実際にはインライン スタイルは必要ありません。

更新されたコードは次のとおりです。

<a href="#abstr'.$row['abstractid'].'" onclick="$(\'#abstr'.$row['abstractid'].'\').toggle()">Read Abstract</a>

<table id="abstr'.$row['abstractid'].'" class="hide">
于 2012-08-22T14:55:11.750 に答える