onsubmit не вызывает мою функцию при нажатии Enter - PullRequest
Новая
       18

onsubmit не вызывает мою функцию при нажатии Enter

0 голосов
/ 22 марта 2011 
<form onsubmit="submit(); return 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" />

Если я изменю «submit ();»«предупредить (« здесь »);»он вызывает функцию оповещения отлично.Почему он не вызывает функцию отправки?

Я хочу, чтобы функция вызывалась, когда пользователь нажимает ввод.http://jsfiddle.net/kaninepete/JsAr4/

примечание: кнопка сбоку предназначена для другой цели и не является частью проблемы. edit Больше работы, пытаясь следовать примеру христиан, привело меня сюда http://jsfiddle.net/kaninepete/MGxNG/

Я не понимаю, почему это отличается от его примера!Все, что я получаю, это "{" error ":" Пожалуйста, используйте POST-запрос "}", и он отлично работает.

Ответы [ 2 ]

2 голосов
/ 22 марта 2011

Нет метода onsubmit для элементов ввода.

В скрипте, если вы измените type = "button" на type = "submit" на кнопке ввода, то форма вызывается, когда вы нажимаетекнопка.

Редактировать:

Ваша проблема, кажется, две вещи.

Во-первых, submit является нативным методом в браузере.,Если вы измените имя на например.mySubmit решает проблему.

Во-вторых, JSFiddle помещает код js в область видимости.Это означает, что определенные вами методы не будут доступны вне этой области.Это можно сделать, сделав метод глобальным: 

window.mySubmit = function () {
    alert('test');
}

Моя скрипка: http://jsfiddle.net/KrooniX/UttWF/

0 голосов
/ 22 марта 2011

Пытался воспроизвести вне jsfiddle, и кажется, что он работает как есть. Может быть, я не получил полный код?

Это то, что я использовал (даже убрал кнопку, обсужденную ранее). Это работает при нажатии Enter в текстовом поле (проверено в FF). Я что-то упускаю? 

<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>
...