0

仕事用イントラネット サイトのよくある質問ページを作成していますが、質問を含む 1 つのファイルと関連する回答を含む 1 つのファイルが必要なので、複数の異なるページを編集する代わりに、2 つのページを編集するだけで済みます。質問がクリックされると、faq.php ページの質問の下に回答が表示されるように動作しています。

<ul>
<li><a id="abc" href="#"> question here</a></li>
<div id="abc1"></div>
</ul>

私の外部jQueryスクリプトページで：

$(function() {
    $('#abc').click(function() {
        $('#abc1').load('test.php #xyz');
});

それはうまく動作します...これを関数に入れる方法はありますか？新しい質問のdiv IDごとにjQueryの新しいブロックを書く必要はありませんか？

4

1 に答える 1

1

IDを使用しないでください。ID は一意である必要があります。したがって、機能を ID セレクターに接続すると、特定の機能になります。一般的な解決策が必要です。

CSS クラス セレクターを使用して、多くのアイテムに適用できるようにします。そこで、このようにマークアップを微調整します。

 <ul>
    <li>
        <a id="abc" href="#" class="q"> question here</a>
        <div id="abc1" class="a"></div>
    </li>
    <li>
        <a id="abc2" href="#" class="q"> question 2 here</a>
        <div id="abc2" class="a"></div>
    </li>
 </ul>

脚本

$(function() {
    $('.q').click(function() {
      var item=$(this);
      item.parent().find(".a").load('test.php #xyz');
});

クリックされた質問の ID を test.php ページに渡して、その特定の質問に対する回答を取得する場合は、(タグの) ID を送信できます。

$(function() {
    $('.q').click(function() {
      var item=$(this);
      var clickedQuestionId=item.attr("id");
      item.parent().find(".a").load("test.php?qid="+clickedQuestionId+"#xyz");
    });
});

これはjsFiddleのデモです（ajaxメソッドを呼び出す代わりに、応答に静的テキストを使用しました） http://jsfiddle.net/EcWFm/11/

于 2012-10-07T01:01:31.160 に答える