доступ к форме javascript - PullRequest
Новая
       11

доступ к форме javascript

0 голосов
/ 24 октября 2011 
<form name = "myForm" onsubmit="foo()">
    <p class = "form-text">Name</p>
    <input type = "text" name="name" />
    <input type = "submit" />
</form>

//javascript (external file)
function foo(){
    alert(document.forms["myForm"].name.value)
}

Что-то не так с этим кодом? Когда я нажимаю «Отправить», он переходит на белую страницу, и ничего не происходит.

Желаемый результат: окно предупреждения со значением поля имени

Ответы [ 3 ]

2 голосов
/ 24 октября 2011

Вы никогда не указывали желаемые результаты, поэтому я могу только предположить, что вы хотели бы видеть значение, предупрежденное о запрете отправки формы.

Если вы должны использовать встроенный JavaScriptвам нужно будет использовать return false; для предотвращения отправки формы, хотя я уверен, что вы хотите, чтобы это зависело от результата foo(), поэтому вместо return false вы можете использовать return foo();, что позволитВы можете выбрать, следует ли предотвратить событие: 

onsubmit="return foo()"
///JS
function foo() {
  alert(...);
  return false;
}

Проблема с кодом, подобным этому, заключается в том, что он напрямую зависит от HTML, вызывающего JS, что нарушает замечательную структуру MVC HTML CSS иJavaScript.Вместо этого добавьте обратный вызов события в коде JS: 

//make sure you add an `[id]` to your form
var form = document.getElementsById('formid');
form.onsubmit = foo;

function foo() {
  //do stuff
  return false;
}
1 голос
/ 24 октября 2011

Проблема в том, что вы не препятствуете отправке формы. Перепишите вашу функцию, чтобы она возвращала либо true, либо false в зависимости от вашего намерения (true для "отправить" и false для "не отправлять"). Затем используйте onsubmit="return foo();", что будет напрямую влиять на отправку формы в зависимости от возвращаемого значения foo().

1 голос
/ 24 октября 2011

попробуйте это: 

<form name = "myForm" onsubmit="foo();return false;">
    <p class = "form-text">Name</p>
    <input type = "text" name="name" />
    <input type = "submit" />
</form>

//javascript
function foo(){
    alert(document.forms["myForm"].name.value)
}
...