使用jQuery選擇數據ID

-1

使用jQuery我希望能夠在用戶單擊其中一個按鈕時從單選按鈕中選擇數據評級？使用jQuery選擇數據ID

<label class="ratingStar"><input type="radio" name="spotRating" id="_1of5" data-rating="1" data-spot-id="1" class="rating-system" /></label> 
<label class="ratingStar"><input type="radio" name="spotRating" id="_1of5" data-rating="2" data-spot-id="2" class="rating-system" /></label>

我曾嘗試以下

$(".ratingStar").on("click", function(){ 

    selected_rating = $('input', $this).data("rating"); 
    selected_id = $('input', $this).data("id"); 


    console.log(selected_rating) 

});

來源

2013-10-01 joshuahornby10

你已經告訴我們你試過了什麼，現在告訴我們它有什麼問題。它有什麼作用？爲什麼不正確？它應該怎麼做？ –

你的兩個按鈕有相同的ID，這是無效的HTML。 – Raidri

'$ this'未定義。這就是你的代碼無法工作的原因。如果你沒有使用可能設置了全局'$ this'的'var'關鍵字，那麼你在控制檯上應該已經很清楚了，除非你有其他類似的功能。 –

試試這個，有一個在元素沒有ID，所以我猜你的意思的數據點-ID

$(".ratingStar").on("click", function(){ 
    selected_rating = $('input', this).data("rating"); 
    selected_id = $('input', this).data("spot-id"); //Changed to spot-id 


    console.log(selected_rating) 

});

來源

2013-10-01 14:15:44 Anton

下面將工作：

$(".ratingStar").on("click", function() { 
    selected_rating = $('input', $(this)).data("rating"); 
    selected_id = $('input', $(this)).data("spot-id"); 
    console.log(selected_rating) 
});

編輯1：實際上，如果我們將$this修改爲this或$(this)，它甚至可以與data("id")一起使用。

例如，下面的工作。點擊here進行演示。

$(".ratingStar").on("click", function() { 
    selected_rating = $('input', this).data("rating"); 
    selected_id = $('input', this).data("id"); // data("spot-id") also works 
    console.log(selected_rating) 
});

編輯2：報價安東尼格里斯特的評論。

上下文（即第二個參數）可以是一個DOM元素或 jQuery對象。 this是一個DOM元素，所以你可以直接傳遞它： $('input', this)。這樣做$(this)調用jQuery的功能，並創建一個新jQuery對象只是含本 - 基於因爲你不需要做到這一點（通過這項工作得很好），你應該避免這樣做

編輯1提供的上述答案是首選。

來源

2013-10-01 14:16:38 Harry

絕對沒有理由做'$（this）'（並且至少有兩個原因，而不是**）。 –

請解釋我，以便我能理解他們並停止使用它。我想這可能會爲答案增加更多價值。注意，它只能用小提琴這種方式工作'$ this'不起作用。 – Harry

上下文（第二個參數）可以是DOM元素或jQuery對象。 'this'是一個DOM元素，所以你可以直接傳遞它：'$（'input'，this）'。做'$（this）'調用jQuery函數，並創建一個簡單包含'this'的新jQuery對象 - 因爲你不需要這麼做（傳遞'this'可以很好地工作），所以你應該避免這樣做。 –

您可以嘗試使用.attr() method引用屬性來訪問數據。

$(".ratingStar").on("click", function(){ 
    selected_rating = $('input', $this).attr("data-rating"); 
    selected_id = $('input', $this).attr("data-spot-id"); 
    console.log(selected_rating); 
});

來源

2013-10-01 14:17:57 Rodik

使用jQuery選擇數據ID

回答

相關問題