2017-10-10 76 views
1

我有一個表,如果X有值,則顯示X,否則,添加一個鏈接,單擊它時將顯示一個文本框,用戶可以在其中輸入該值。我動態地分配ID /類到鏈接和文本框,但是當我運行該應用程序時,每個單擊任何鏈接似乎只觸發第一行。我發出警報以顯示正在點擊的行,並且我總是得到第一行。看看瀏覽器的DOM瀏覽器,我可以看到每行都有自己的唯一ID。我如何獲得每個OnClick事件以獲取正確的對應ID?OnClick事件只獲取第一個動態創建的行/ ID

C#/剃刀代碼:

<td> 
     <a href="#" class="unmapped" onclick="UnmappedClick()" id="@string.Format("tr{0}",i)">Unmapped</a> 
     <input type ="submit" class="editAction hidden" value="@string.Format("tr{0}",i)" name="action:ChangeToEditSubAction" /> 
     <input type="hidden" name="@Html.Raw("EntityMapping.EMREntityID")" value="@Html.Raw(Model.DisplayResults[i].EMREntityID)" /> 
     <span class="@string.Format("tr{0}accountTxtBox",i) hidden">@Html.TextBoxFor(m => m.EntityMapping.AssignedHOAccountID)</span> </td> 

JavaScript函數

function UnmappedClick() { 
    //$(".accountTxtBox").removeClass("hidden"); 
    //$(".unmapped").addClass("hidden"); 
    //$("#btnSave").removeAttr('disabled'); 
    //$(".editAction").click(); 
    //$(".editAction").val(null); 

    alert($(".unmapped").attr('id')); 
    var txtBox = $(".editAction").val(); 
    var actTextBox = "." + txtBox + "accountTxtBox"; 
    $(actTextBox).removeClass("hidden"); 
    alert(txtBox); 

} 

DOM Explorer Image

回答

0

您可以使用 「本」 關鍵字的onclick事件傳遞一個參數。

onclick="UnmappedClick(this.id)" 

function UnmappedClick(id){ 
//now you have the specific ID 
} 

或在必要時通過整體控制

onclick="UnmappedClick(this)" 
+0

謝謝。就這樣做了。沒有運氣:(仍然提醒「未定義」 – Queen13

0

你可以試試這個

$(this).attr('id') // use this 

代替

$(".unmapped").attr('id') 

這會給你目前的元素ID當你點擊

+0

我只是做了一個提示,並得到了「undefined」。 – Queen13

+0

你可以通過函數調用 'onclick =「UnmappedClick(this)」''這個'並嘗試獲取它在功能 'UnmappedClick(this){}' –

+0

我試圖通過'this'並且出現此錯誤。「使用關鍵字標識符無效」 – Queen13

0

正如你可以看到here,使用$('.class')將返回一個列表與該類的所有元素。當您使用$(".unmapped").attr('id')時,您將始終獲得列表中第一個元素的值,這就是您始終獲得第一行的原因。

對於var txtBox = $(".editAction").val();也會發生同樣的情況。使用$(actTextBox).removeClass("hidden");,您將刪除隱藏的所有匹配元素中的類。

爲了得到一個元素的ID,您可以使用onclick="unmapped(this)onclick="unmapped(this.id)"使用取決於onclick屬性下面的代碼

function unmapped(element) { 
    var id = $(element).attr('id') 
    alert(id) 
} 

function unmapped(id) { 
    alert(id) 
} 

您可以檢查this fiddle看到他們在行動。