click() a button named 'submit' in Javascript

问题

I have this HTML:

<input type="submit" name="submit" value="Invoeren" accesskey="s" class="buttons"/>

I'd like to click() it. I can not change anything on the HTML-side. When I do getElementById("submit").click(), I get this:

>>> document.getElementById("submit").click();
Cannot convert 'document.getElementById("submit")' to object

Any hints?

回答1:

Since you can't edit the actual HTML (to add the id attribute), and you want this to be cross-browser, you could loop over all of the input elements and check the type and value attributes until it matches your submit button:

function get_submit_button() {
    var inputs = document.getElementsByTagName('INPUT');
    for(var i=0; i < inputs.length; i++) {
        var inp = inputs[i];
        if(inp.type != 'submit') continue;
        if(inp.value == 'Invoeren' && inp.name == 'submit') {
            return inp;
            break; // exits the loop
        }
    }
    return false;
}

function click_submit() {
    var inp = get_submit_button();
    if(inp) inp.click();
}

回答2:

NOTE: NEVER call anything in a form "submit"! It will hide the form's submit event from script.

You have many ways of accessing the button

document.querySelector("[name=submit]").click(); // first named button

document.querySelector("#form [name=submit]").click(); // in form with id="form"

Old IEs would shadow the name so you could use getElementById on a name but it is not recommended.

Older methods:

document.getElementsByName("submit")[0].click();

where 0 is the first element on the page named submit.

document.forms[0].elements[0].click();

where forms[0] is the first form and elements[0] is the first element

document.getElementsByTagName("form")[0].elements[0].click();

where ("form")[0] is the first form on the page and elements[0] is the first element

回答3:

You are using getElementById but you don't have an id attribute on your input. Just because IE totally fubars the namespace and treats name attributes somewhat like id attributes does not mean that you should.

<input id="submit" ... />
...
document.getElementById('submit').click();

回答4:

The immediate issue i can see is that you have NOT assigned id submit to your input, so this won't work:

document.getElementById("submit").........

unless you specify the id as well:

<input id="submit" type="submit" name="submit" value="Invoeren" accesskey="s" class="buttons"/>

回答5:

There is no element with the ID "submit" -- you have an element named "submit". As Dylan points out, jQuery would make everything easier, but you can fix it yourself. If you cannot change the HTML, do something like this:

var buttons = document.getElementsByTagName("submit");
for (var i=0; i < buttons.length; i++) {
  var button = buttons[i];
  if (button.getAttribute("name") === "submit") {
     button.onclick = whatever ...

回答6:

Your input has no id attribute so it can't be retrieved by id. Use this instead.

<input id="submit" type="submit" name="submit" value="Invoeren" accesskey="s" class="buttons"/>

回答7:

You might want to look into jQuery. It makes everything so, so much easier.

来源：https://stackoverflow.com/questions/4571497/click-a-button-named-submit-in-javascript

标签

javascript

javascript-objects

dom-events