2011-07-23 14 views
14

id = "A B"の要素があります。次のコードを失敗:jQuery:id属性のスペースを扱う

<input type="text" id="A B"> 
<script>$("#A B").click(function(){alert();});</script> 

次のコードを失敗しない:

<input type="text" id="AB"> 
<script>$("#AB").click(function(){alert();});</script> 
+0

[スペースでのjQueryのID]が重複する可能性(http://stackoverflow.com/questions/596314/jquery-ids- with-spaces) –

答えて

24

それはID内のスペースを持っているHTMLに属性値をすることは技術的に無効だが(karim79の答え@参照) jQueryを使用して実際に選択することができます。

http://mothereffingcssescapes.com/#A%20Bを参照してください:あなたはid="A B"で要素を選択する$('#A\\ B');を使用できるよう

<script> 
    // document.getElementById or similar 
    document.getElementById('A B'); 
    // document.querySelector or similar 
    $('#A\\ B'); 
</script> 

jQueryのは、セレクタのAPIに似た構文を使用しています。 CSSの要素をターゲットに

、あなたはこのようにそれを逃れることができます:

<style> 
    #A\ B { 
    background: hotpink; 
    } 
</style> 
+0

誰かが不思議に思っている場合は、これはスペースでIDを選択しようとするとCapybaraでも動作します。 –

1
 
ID tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods ("."). 

引用を別のstackoverflowの答えから引き出されていること:jquery IDs with spaces

9

どちらHTML4もHTML5では、ID属性値にスペース文字を使用できます。 IDトークンは文字 ([A-ZA-Z])で始まる必要があり、文字、数字 ([0-9])、ハイフンの任意の数が続いてもよいこと

HTML 4.01仕様状態( - )、アンダースコア(_)、コロン(:)、ピリオド(。)を使用します。 class属性には、このような制限はありません。クラス名は に任意の文字を含めることができ、 に有効な文字で始める必要はありません。

HTML5はid属性の追加の制限を取り除きます。 は、ドキュメント内で一意であることを除けば、 であり、値は少なくとも1文字(空ではない)でなければならず、 であり、スペース文字を含むことはできません。

出典:

http://mathiasbynens.be/notes/html5-id-class

+0

+1これは正しいです。しかし、HTMLのID属性値にスペースを入れることは技術的には無効ですが[jQueryセレクタを正しくエスケープしても機能させることができます](http://stackoverflow.com/questions/6802765/jquery-dealing-with -aスペース内のid属性/ 7873035#7873035)。 –

9

彼らはあなたがIDにスペースを使用するべきではありません述べたように。 しかし、とにかく、これはあなたのために働いていないでしょうか?

$("[id='A B']").click(...) 

EDIT:はい、それは動作しますが、それをテスト!標準愛好家、私を殺さないでください! ;-P

3

IDにスペースがあってはならないが、これは作品に思える:

$("[id=A B]") 
+0

それは私たちが同時に投稿したようです:) – TMS

関連する問題