jQuery的CSS選擇器匹配形式數組名稱

Question

HTML

<input name="single"> 

<input name="multi[]"> 
<input name="multi[]"> 

<input name="multi_keys[my]"> 
<input name="multi_keys[key]"> 

jQuery的

var match_single  = $('[name="single"]'); 
var match_multi  = $('[name="multi"]'); // No match 
var match_multi_keys = $('[name="multi_keys"]'); // No match 

console.log(match_single.length); 
console.log(match_multi.length); 
console.log(match_multi_keys.length); 

它只會匹配match_single因爲其他選擇是不正確的。

我怎樣才能讓他們匹配表單字段數組呢？

我可以這樣做：

var match_multi  = $('[name="multi[]"]'); 

，但我怎麼能在裏面有鑰匙，他們是未知的匹配嗎？我想它這樣寫：

$('[name="multi_keys*'); 

Answer 1

您可以使用^=相匹配的屬性開頭的：

$('[name^="multi"]') 

注意，這將匹配都name="multi[]"和name="multi_keys[]"。如果您想選擇multi[]和multi_keys[]分開，你可以開放方括號簡單地添加到選擇：

$('[name^="multi["]') 

...和：

$('[name^="multi_keys["]') 

---

[att^=val]

表示具有att屬性的元素，其值以前綴「val」開頭。如果「val」是空字符串，那麼選擇器不會表示任何內容。

– W3C's Selectors specification

Answer 2

的=像以前一樣使用*這個$('[name*="multi"]');

var match_single = $('[name="single"]'); 
 
var match_multi = $('[name*="multi"]'); // No match 
 
var match_multi_keys = $('[name*="multi_keys"]'); // No match 
 

 
console.log(match_single.length); 
 
console.log(match_multi.length); 
 
console.log(match_multi_keys.length);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input name="single"> 
 

 
<input name="multi[]"> 
 
<input name="multi[]"> 
 

 
<input name="multi_keys[my]"> 
 
<input name="multi_keys[key]">

Answer 3

您可以通過匹配輸入名稱的前綴查詢這些投入物，如$('[name^=multi_keys]')所以它會選擇'name以multi_keys開頭。但這很不方便。