为什么此javascript代码不起作用？

如何解决为什么此javascript代码不起作用？

| 您知道为什么失败了吗，我的意思是警报正在起作用（它告诉我，如果找到该按钮），但是文本或背景没有更改：

    $(\'input[type=button]\').click( function() {

    var button=document.getElementsByName(\"contactme\");
    alert(button.length + \" elements!\");
    button.value=\"New Button Text\";
   button.style.backgroundImage=\"url(some_real_gif);\"
});

HTML：

<input type=\"button\" name=\"contactme\" value=\"test\"/>

谢谢... 我必须使用普通的Java脚本而不是jQuery ..     

解决方法

看起来

var button=document.getElementsByName(\"contactme\");

将返回元素数组。尝试：

var button=document.getElementsByName(\"contactme\")[0];

    ,您正在设置NodeList的

value

和

style

。

getElementsByName

可以检索多个元素，因为

name

属性在文档中不必唯一（名称中就是线索！）设置这些效果无效-不会影响元素的属性）。 手动循环使用元素（使用

for

循环）或完全使用jQuery：

$(\'input[type=button]\').click(function () {
    var buttons = $(\'input[name=\"contactme\"]\');
    alert(buttons.length + \" elements!\");
    buttons.val(\"New Button Text\");
    buttons.css({backgroundImage: \"url(some_real_gif)\"});
});

请参阅jQuery API：

val

css

属性等于选择器（

[name=\"value\"]

）     ,

getElementsByName

将返回一个nodeList，但是

value

和

style

是HTMLElementNodes的属性。您必须遍历列表才能获取它们。     ,

$(\'input[type=button]\').click(function() {
     $(\"#contactme\").val(\'New Button Text\').css(\'background-image\',\'url(some_real_gif)\');
});

您需要确保按钮ID与名称匹配...     ,因为button是元素列表（即使它是一个元素列表） 您可以使用

button[0].value

和

button[0].style.background

或使用jQuery解决方案： 要更改仅单击的按钮：

$(\'input[type=button]\').click( function() 
{
    $(this).val(\"New Button Text\");
   $(this).css(\'background-image\',\'url(\"some_real_gif\")\');
});

更改所有按钮：

$(\'input[type=button]\').click( function() 
{
   $(\'input[type=button]\').each(function(){
        $(this).val(\"New Button Text\");
        $(this).css(\'background-image\',\'url(\"some_real_gif\")\');
    });
});