如何更新動態輸入控件的背景顏色？

我使用下面的JavaScript成功創建一些動態的輸入文本框：如何更新動態輸入控件的背景顏色？

var type = "Textbox"; 
var foo = document.getElementById("fooBar"); 

for (i = 1; i <= totalQty; i = i + 1) { 

    var textbox = document.createElement("input"); 
    //Assign different attributes to the element. 
    textbox.setAttribute("type", type + i); 
    //textbox.setAttribute("value", type + i); 
    textbox.setAttribute("name", type + i); 
    textbox.setAttribute("id", type + i); 
    textbox.setAttribute("style", "width:300px"); 
    textbox.setAttribute("width", "300px"); 

    //Append the element in page (in span). 
    var newline = document.createElement("br"); 
    foo.appendChild(newline); 
    foo.appendChild(textbox); 
}

一切正常這一點。一旦用戶輸入數據並點擊提交，我需要返回並將任何文本框的背景顏色設置爲紅色。我發現一些代碼做實際的色彩：

textbox.style.backgroundColor = "#fa6767";

... ...我知道文本框的確切名稱與錯誤（即「Textbox1的」，「TextBox2中」，「Textbox3」等），但我'不知道如何編程式地將此背景顏色代碼分配給特定的文本框。我不能使用這樣的事情，因爲所有代碼都是動態生成的：

errorTextbox = $("#Textbox1");

有什麼建議嗎？

來源

2012-09-18 goalie35

什麼是'type =「Textbox1」'？ – epascarello

我結束了以下準備：

document.getElementById('Textbox1'.style.backgroundColor = "#fa6767";

我原來並不認爲我能夠以這種方式捕捉我的「Textbox1」控件，因爲當我查看html源代碼時，由於我動態創建它，因此沒有「Textbox1」。

謝謝。

來源

2012-09-19 14:48:47 goalie35

看起來你正在構建一個表單驗證腳本。這裏有一個更簡單的方法來做到這一點：

1）在你的stlyesheet中爲你的錯誤類創建一個條目。添加和刪除類需要的步驟少於單獨分配屬性的步驟。

.error { 
    background-color: #ff0000; 
}

2）舉例來說，給所有你希望驗證唯一類名「valMe」的文本框。

3）然後依次通過他們在驗證步驟：

$('.valMe').each(function() { 
      $(this).removeClass('error'); 
      if($(this).text=='') { 
       $(this).addClass('error'); 
      } 
    })

通過使用「這個」你指的是當前元素，所以你甚至不需要知道該元素的ID。

來源

2012-09-18 15:08:15

如果您已經知道元素的name（在本例中與id相同），則可以使用jQuery通過使用字符串連接形成選擇器來選擇元素。假設你有一個存儲有錯誤的文本框中的name/id一個變量，那麼它是一個相對簡單的過程：

var errorTextboxName = 'Textbox1'; 
$('#' + errorTextboxName).css('background-color', 'red');

來源

2012-09-18 15:41:04

如何更新動態輸入控件的背景顏色？

回答

相關問題