javascript
  • jquery
  • html
  • xhtml
  • 2011-12-07 63 views 1 likes 
    1

    JQueryを使用するための変数を格納することについて考えてみたいです。JQuery変数を保存する最も良い方法は?

    ここではJQueryはvideo_idによって映像をvideo_id隠された入力の値を使用し、次いでvoteupなります。

    <form class='voteup' action='' method='post'> 
        <input type="hidden" name='video_id' value='<?php echo $video_id; ?>' /> 
        <input type='submit' value='Vote Up' /> 
    </form> 
    

    注:これは単なる例です。

    しかし、同じことをするリンクが必要な場合はどうすればいいですか? video_idはどこに保管しますか?

    class属性にvideo_idを格納することはできましたが、特に複数の変数を送信する必要がある場合は、これが最善の方法であるとは思われません。

    これに関するご意見はありますか?

    私はXHTMLの有効な方法を探しているに過ぎません。

    +7

    '$( "A")のデータ( "VIDEO_ID")' - 。http://api.jquery.com/data/ –

    +2

    @RobWあなたはすでにそのあまりの評判を持っているを参照してください実際の回答として投稿する必要はありませんか? ;-) –

    +0

    おかげでRob、私はこれを見てみましょう。 –

    答えて

    8

    任意のデータを要素に添付するjQuery dataメソッドです。あなたの場合、私はあなたが正しく何をしようとして理解している場合、あなたはおそらくこのような何かをしたい:

    $(document).ready(function() { 
        $("#yourLink").data("video_id", "<?php echo $video_id; ?>"); 
    }); 
    

    有効なXHTMLのソリューションを探していると、あなたはHTML5を使用することはできませんdata-*属性。その場合、(例ではvalue属性で行ったように)要素に直接属性値を追加することができます。

    この方法では、対応するdata-*属性が要素に存在する必要はないため、有効なXHTMLを書くことができます。

    +0

    これは事実ですが、動作コードからマークアップを完全に分離することができれば便利です。そのため、マークアップ自体に関連する付属プロパティを組み込むのが便利です。 – Pointy

    +0

    同意しましたが、 'data- *'属性を使用することができず、あまり選択肢がありません。あなたが言及したように、あなたは 'rel'を使うことができますが、それは意味論的ではありません。私は彼らが好む営業にまで及ぶと思う。 –

    2

    HTML5をdiggする場合は、データ属性を使用する必要があります。 HTML 5ページで

    http://ejohn.org/blog/html-5-data-attributes/

    1

    、あなたは "DATA-は" そのようなことのために属性を使用することができます。

    <img src='http://placekitten.com/100/100' data-video-id='whatever'> 
    

    次に、jQueryのから:

    $('img').click(function() { 
        var video = $(this).data('video-id'); // 'videoId' also works here 
    }); 
    

    あなたが」 (悲劇的に)厳密なXHTMLで立ち往生しています。まあ、あなたは立ち往生しています。 <a>タグの場合は、おそらく "rel"属性を使用することができます。一般に「クラス」はおそらく実際に行うことです。私は「クラス」に名前と値のペアのために使用されてきた慣習は、コロンで区切り、その後、正規表現を経由して、それらを抽出することである。

    <sometag class='whatever videoId:video22 something'> 
    

    、その後:

    あなたが使用することができます
    $('sometag').click(function() { 
        var videoId = this.className.replace(/videoId:(\S*)/, '$1'); 
        // ... 
    }); 
    
    +0

    'data-'属性は、doctypeに関係なく動作します。 –

    +1

    @ NathanAnderson - 動作しますが、有効ではありません。 –

    +0

    @NathanAndersonはい、ただし厳格なXHTMLには準拠していません。コードを検証する場合は、XHTMLで任意の属性を使用することはできません。 – Pointy

    1

    おそらくrel属性を使用し、.attr()メソッドを使用してjQueryで取得します。

    var myVar = $('#link_id').attr('rel'); 
    

    http://api.jquery.com/attr/

    関連する問題