HTML

Question

我有一个名为save changes的函数，看起来像这个

function saveChanges() {
  var theCity = city.value;
  var theState = state.value;
  var theEmail = email.value;
  var theAge = age.value;
  var theGender = gender.value;
  var theOther = other.value;
    alert("theCity is: "+ theCity);
    alert("theState is: "+ theState);
    alert("theEmail is: "+ theEmail);
    alert("theAge is: "+ theAge);
    alert("theGender is: "+ theGender);
    alert("theOther is: "+ theOther);
}
window.onload=function (){
    document.getElementById('ok').onclick=saveChanges;

}

我有一个简单的html页面上有多个输入。

要提交内容，我在底部有一个链接。

<a href="#" id="ok" style="color:white;">Click here <-- </a>

我已经制作了一个id ='ok'的按钮，但它不起作用。

我错过了什么？

Answer 1

请试试这个，

HTML

<form onsubmit="return validate(this)" method="POST" action="a_post_page.php">
    name: <input type="text" name="name" /> <br />
    email: <input type="text" name="email" /> <br />
    age: <input type="text" name="age" /> <br />
    gender: <input type="text" name="gender" /> <br />
    city: <input type="text" name="city" /> <br />
    <br />
    <input type="submit" name="submit_form" value="Save" />
</form>

的Javascript

function validate(form1) {  
    if(form1.name.value === "") {  
        alert("Please type your name the name feild.");  
        return false;  
    }  
    if(form1.email.value === "") {  
        alert("Please type your email the email feild.");  
        return false;  
    }  
    if(form1.age.value === "") {  
        alert("Please type your age the age feild.");  
        return false;  
    }  
    if(form1.gender.value === "") {  
        alert("Please type your gender the gender feild.");  
        return false;  
    }  
    if(form1.city.value === "") {  
        alert("Please type your city the city feild.");  
        return false;  
    }  
    return true;  
}

Answer 2

href是同一页面。在运行该脚本之前，单击该按钮可能会重定向。尝试返回false或其他内容。

Answer 3

我假设您的保存功能会检查表单中的某些字段以便提交它们。如果是，则错误不是关于链接或提交，问题是您使用变量的方式。你不能只做city.value，你需要使用document.getElementById（＆＃39; city＆＃39;）。value。这将导致javascript为您提供未定义的＆＃34;变量＆＃34;错误并停止执行。正确的代码是：

function saveChanges() {
  var theCity = document.getElementById('city').value;
  var theState = document.getElementById('state').value;
  var theEmail = document.getElementById('email').value;
  var theAge = document.getElementById('age').value;
  var theGender = document.getElementById('gender').value;
  var theOther = document.getElementById('other').value;
    alert("theCity is: "+ theCity);
    alert("theState is: "+ theState);
    alert("theEmail is: "+ theEmail);
    alert("theAge is: "+ theAge);
    alert("theGender is: "+ theGender);
    alert("theOther is: "+ theOther);
}
window.onload=function (){
    document.getElementById('ok').onclick=saveChanges;

}

Answer 4

尝试

<强> HTML

<input type='text' id='city'> <br />
  <input type='text' id='state'> <br />
  <input type='text' id='email'> <br />
  <input type='text' id='age'> <br />

<hr>
<a href="#" id="ok" style="">Click here </a>

<强>的Javascript

function id(e){
   return document.getElementById(e);
}

function saveChanges(){
   var city  = id('city').value,
       state = id('state').value,
       email = id('email').value,
       age   = id('age').value;

    alert("City : " + city + "\nState :" + state  +"\nEmail : " + email + "\n Age  : " + age);  

    return false;
}
window.onload = function(){    
    document.getElementById("ok").onclick = saveChanges;
};

演示：http://jsfiddle.net/Zjrd3/

Answer 5

document.getElementById不会适用于多个元素。 ID应该是唯一的。

Javascript按钮vs链接提交？

5 个答案:

HTML

的Javascript