onsubmit is not calling my function when Enter is pressed
<form onsubmit="submit(); r开发者_开发百科eturn false;" name="text" id="form" method="get">
<input type="feild" style="font-size: 150%;" id="field" name="field" value=""
onSubmit="this.value='';"/>
<input type="button" id="add" style="font-size: 150%;" value=" Add tally to score "/>
<input type="submit" value="submit" style="visibility:hidden" />
If I change "submit();" to "alert('here');" it calls the alert function perfectly. Why does it not call the submit function?
I want the function to be called when the user presses enter. http://jsfiddle.net/kaninepete/JsAr4/
note: The button on the side is for a different purpose, and not part of the problem. edit More work, trying to follow Christians example has gotten me here http://jsfiddle.net/kaninepete/MGxNG/
I don't see why this is different than his example! All I get is "{"error": "Please use POST request"}" and his works perfectly.
There is no method onsubmit on input elements.
On fiddle, if you change the type="button" to type="submit" on the input button, then the form is called when you press the button.
Edit:
Your problem seems to be two things.
One is that the submit is a native method in the browser. If you change the name to eg. mySubmit solves the problem.
The second is that JSFiddle put the js code inside a scope. This means that the methods you define will not be available outside that scope. This is resoved by making the method global:
window.mySubmit = function () {
alert('test');
}
My fiddle: http://jsfiddle.net/KrooniX/UttWF/
Tried to reproduce outside of jsfiddle, and it feels like it's working as is. Maybe I didn't get the complete code?
This is what I used (even removed the button discussed earlier). This works when pressing Enter in the textbox (tested in FF). Is there something I'm missing?
<html>
<head>
<style>
</style>
<script lang="javascript">
var tally = "0";
window.onload = setup;
function setup() {
drawTally();
document.getElementById("add").onclick = addScore;
document.getElementById("form").onSubmit= submit;
}
function addScore() {
document.getElementById('change').innerHTML = parseInt(document.getElementById('change').innerHTML)+tally;
tally=0;
}
function submit(){
alert("it worked!");
}
function drawTally() {
var elem = document.getElementById('tallyDisp');
//var tally = 0;
if (elem && elem.getContext) {
var context = elem.getContext('2d');
if (context) {
context.fillStyle = '#9f9';
context.fillRect(0, 0, 300, 200);
context.fillStyle = '#00f';
context.font = 'bold 100px sans-serif';
context.textAlign = 'center';
context.textBaseline = 'middle';
context.fillText(tally, 150, 100);
}
}
}
setInterval("drawTally();", 60);
</script>
<body>
<h1>Farkle</h1>
<canvas height="200" width="300" id="tallyDisp">Oops!</canvas>
<form onsubmit="tally=parseInt(tally)+parseInt((text.elements.field.value));
document.text.elements.field.value=''; return false;" id="form" name="text">
<input type="feild" onsubmit="this.value='';" value="" name="field" id="field" style="font-size: 150%;">
</form>
<p>Your score is <span id="change"> 0</span>!</p>
</body>
</html>
加载中,请稍侯......
精彩评论