用CHECKBOX替換TextBox使用getElementsByName

我有一個很長的名稱的文本框。我試圖在頁面加載時動態地用一個複選框替換它。下面是代碼。我嘗試使用只有線用CHECKBOX替換TextBox使用getElementsByName

document.getElementsByName("!SRC!SKU!U_PLANNEDACTIVITY!E!amrit_test_search!U!2")[0].style.display="none"

在我的JavaScript，但即使這是行不通的。所以我想這是有問題的

document.getElementsByName() 


     <html> 
    <head> 
    <script type="text/javascript"> 
    $(document).ready(function() 
    { 
    //var a="!SRC!SKU!U_PLANNEDACTIVITY!E!amrit_test_search!U!2"; 
    var myElement = document.createElement('<input type="checkbox" name="vehicle" value="Bike" id="checkPub"/>'); 
    document.getElementsByName("!SRC!SKU!U_PLANNEDACTIVITY!E!amrit_test_search!U!2")[0].insertAdjacentElement('afterEnd', myElement); 
    document.getElementsByName("!SRC!SKU!U_PLANNEDACTIVITY!E!amrit_test_search!U!2")[0].style.display="none"; 



    }); 
    </script> 
    </head> 
    <body> 
    <input type="text" name="!SRC!SKU!U_PLANNEDACTIVITY!E!amrit_test_search!U!2" value="1" /> 
    </body> 

</html>

來源

2012-09-07 user1653887

你不能像這樣使用document.createElement！

檢查：https://developer.mozilla.org/en-US/docs/DOM/document.createElement

所以，你需要這樣的事：

var myElement = document.createElement('input'); 
myElement.type = "checkbox"; 
myElement.name = "vehicle"; 
myElement.value = "Bike"; 
myElement.id = "checkPub";

也不會傷害來查找元素只有一次，和字符串存儲在一個變量：

var a="!SRC!SKU!U_PLANNEDACTIVITY!E!amrit_test_search!U!2"; 
var origelem = document.getElementsByName(a)[0]; 
origelem.insertAdjacentElement('afterEnd', myElement); 
origelem.style.display="none";

你也似乎在使用jQuery（從$(document).ready(...判斷）。如果你不使用jQuery嘗試這樣的：

<html> 
    <head> 
     <script type="text/javascript"> 
     function onLoad() { 
      var a="!SRC!SKU!U_PLANNEDACTIVITY!E!amrit_test_search!U!2"; 
      var myElement = document.createElement('input'); 
      myElement.type = "checkbox"; 
      myElement.name = "vehicle"; 
      myElement.value = "Bike"; 
      myElement.id = "checkPub"; 
      var origelem = document.getElementsByName(a)[0]; 
      origelem.insertAdjacentElement('afterEnd', myElement); 
      origelem.style.display="none"; 
     } 
     </script> 
    </head> 
    <body onload="onLoad()"> 
     <input type="text" name="!SRC!SKU!U_PLANNEDACTIVITY!E!amrit_test_search!U!2" value="1" /> 
    </body> 
</html>

希望這適用於你。

還學會了DEBUG。使用螢火蟲或類似的Chrome開發工具。有一個控制檯告訴你有關錯誤。

編輯：insertAdjacentElement將只能在IE瀏覽器和鉻。一個簡單的

origelem.parentNode.appendChild(myElement);

是一個很好的替代品。

來源

2012-09-07 07:05:53 SoonDead

它的工作經過一個小小的變化，但只有在ie和鉻不與mozilla :(。只是一個小的變化 input type =「text」name =「！SRC！ SKU！U_PLANNEDACTIVITY！E！amrit_test_search！U！2「value =」1「/> – user1653887

我看到了，使用google後我發現這個函數沒有在ff中實現，爲你提供一個功能。 – SoonDead

用CHECKBOX替換TextBox使用getElementsByName

回答

相關問題