使用getElementsByName替换TextBox和CHECKBOX

时间:2012-09-07 06:41:16

标签: javascript html

我有一个名字很长的文本框。我试图在页面加载时动态替换它。下面是代码。我尝试过只使用

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>

1 个答案:

答案 0 :(得分:0)

您不能像这样使用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>

希望这适合你。

还要学习调查。使用萤火虫或类似物的铬开发工具。有一个控制台告诉你错误。

编辑:insertAdjacentElement仅适用于IE和Chrome。一个简单的

origelem.parentNode.appendChild(myElement);

是一个很好的替代品。