0

多くの人がこのジレンマに一度に遭遇したと確信しています。

複数のブロックレベルおよびインラインレベルの要素を含むブロックレベルのHTML要素があります。

<div id="ajax">
   <h2>Something</h2>
   <div class="icon"></div>
   <div class="clear"></div>
   <div class="somethingelse"><h3>blah</h3></div>
</div>

jQuery ajax（）イベントを#ajax（最上位要素）のクリックにアタッチしたいだけですが、いくつかのパラメーターをサーバー側スクリプトに渡す必要があります。

私が見ている可能性のある方法の1つは、単にに置き換えることです。これにより、のようなものを追加できますdiv#ajaxが、これによりページが無効になります。インライン要素（）内にブロックレベルの要素（）を含めることはできません。a#ajaxhref="param=value&this=that"<div><a>

もう1つの可能な方法は、にrel属性を追加することですdiv#ajax。これは、XHTML検証を無視することも意味します。

インラインイベントをdivに追加したくありませんonclick。それは少し遠すぎます...また、すべての子div#ajaxをegに変える<span>ことは大きなピタになります。

これをどのように処理しますか？

ありがとう！

4

1 に答える 1

2

XHTML の有効性を維持しながら、または少なくともすべてのブラウザーで完全に機能するようにするには、いくつかの方法があります。

最初のオプションは、パラメーターを JavaScript のどこかに直接配置します。これが最も簡単です。

第二に、スクリプトでこれを行うことができない場合は、アンカーを使用できますが、次のようにラップせずに内部で使用できます。

<div id="ajax">
   <h2>Something</h2>
   <div class="icon"></div>
   <div class="clear"></div>
   <div class="somethingelse"><h3>blah</h3></div>
   <a class="params" href="page.htm?param=value&this=that"></a>
</div>

それを隠すCSS：

.params { display: none; }

そしてそれを使用するjQuery：

$("#ajax").click(function() {
   $.ajax({
     url: $(this).find(".params").attr("href");
     success: function() {
       //do something
     }
   });
});

3 番目に、HTML5 のデータ属性を使用します。これは厳密な XHTML の有効性を破りますが、将来的には優れた方法であり、現在のブラウザーでは問題が発生しません。

最後のオプション (私が考えることができる) は、jQuery メタデータ プラグインを使用するか、必要なものを保存します。

于 2010-06-29T01:41:57.027 に答える