jQuery的輸入更新所有的ID，而不僅僅是一個需要

Question

我遇到的問題是相當困難的我解釋，但我在的jsfiddle複製它http://jsfiddle.net/6ms4T/1/

我想實現是更新「數量」文本框，我想顯示其他地方的值（下面我將稱之爲「成本線」）。

基本上，更新第一個輸入框（qty_item_1）正在更新'成本行'中的所有（quant_）ID，而不僅僅是與該產品相關的一個。

function recalc(){ 

$("[id^=quant_]").text($("input[id^=qty_item_]").val()); 

等等

全部代碼是在這裏：http://jsfiddle.net/6ms4T/1/

任何幫助，將不勝感激。

Answer 1

，可以看到正在改變的元素的ID，然後提取它的數字部分在你計算的休息使用。下面是我改的各個方面和working version：

var uniqueOne = $(this).attr("id").match(/\d+/); 
$("[id^=quant_][id$="+uniqueOne+"]").text($("input[id^=qty_item_][id$="+uniqueOne+"]").val()); 

雖然不是最乾淨尋找代碼，它的作用是發現與quant_開始和結束uniqueOne的ID。你可能會壓縮這些，但它突出了結合兩個選擇器（開始與結束）。

看起來像你有很多偉大的想法可供選擇。

編輯：

如果你的ID不qty_item_啓動，那麼你就需要使用不同的選擇。這個最低掛果實將是contains selector：id*=blah。

更新版本的 '毛' IDS發現：http://jsfiddle.net/6ms4T/22/

編輯：

以前的jsfiddle沒有處理的總更新預期。這個更新版本應該通過識別所有通過ID查找DOM元素的情況來減少混淆;然而，這應該被重構的可能性很高：http://jsfiddle.net/6ms4T/24/。

編輯：

OP的標籤產生了到他的ID各種數字和字母，但最終的數字是由一個下劃線開頭。重要的id因此在正則表達式/\d+$/中找到。正如其他海報所示，解決這個問題的方法不止一種。我個人喜歡用戶gabitzish的。

Answer 2

可以讓事情比較簡潔，而且通過識別id的數字部分，然後使用該號碼作爲選擇的一部分應用於事件只有特定的元素：

var idNum = this.id.match(/\d+/); 
$("#quant_" + idNum).text($("#qty_item_" + idNum).val()); 

JS Fiddle demo。

參考文獻：

• match()。
• Regexp。

Answer 3

添加一個包含輸入信息的屬性。我爲第一個輸入添加了一個屬性「rel」，值爲1，第二個爲2，然後使用這個rel爲li元素構建正確的id。

這裏是一個更新工作的jsfiddle：http://jsfiddle.net/6ms4T/8/

Answer 4

更改recalc（）函數的開始如下;

function recalc(e){ 
    var idx = $(e.target).attr('id').split('_').pop(); 
    $("[id^=quant_" + idx + "]").text($(e.target).val()); 

... }