Любая идея, почему предупреждение не отображается, когда форма отправляется пустым?

Question

Привет, ребята, пытающиеся сделать проверку формы, но самая простая вещь, которую я делаю с javascript, не работает ни с какими идеями, что я делаю неправильно?

HTML:

<form onsubmit= "return formCheck();" method="POST" action="check.php" > 
name: <input type="text" name="name" onchange="valid_name.checked = true;"> 
<input type="checkbox" disabled="disabled" name="valid_name"> 
<input type="submit" value="Submit"> 
</form> 

JavaScript:

function formCheck() { 
    if(this.name.value == ""){ 
     alert("You forgot to enter your name"); 
     this.name.focus(); 
     return false; 
    } 
} 

jsfiddle

http://jsfiddle.net/Lawwf/rRNBy/

спасибо заранее.

Answer 1

Среди многих других вещей:

1. Использование «это» вне контекста объекта будет сгенерировано сообщение об ошибке.
2. Вам не хватает возврата в случае ошибки.
3. В вашем jsFiddle вы пропустили процитировать лежит в руке событие с

LER строки

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

... 
<form onsubmit="return formCheck(this);" method="POST" action="check.php" > 
... 

, а затем:

function formCheck(myForm) { 
    if(myForm.name.value == ""){ 
     alert("You forgot to enter your name"); 
     myForm.name.focus(); 
     return false; 
    } 
    return true; 
} 

Answer 2

Есть некоторые вещи неправильно со скрипкой:

• Нет котировок по return formCheck(); - хотя приведенный здесь код имеет их.
• Ваш JS-код сконфигурирован для выполнения при загрузке, что делает formCheck недоступным для глобального контекста (параметр должен быть изменен на «no wrap»).

И что-то не так с кодом:

• Внутри обработчика событий this является window объект, а не форма. Окно уже имеет свойство name, что противоречит тому, что вы пытаетесь сделать. Вместо того чтобы работать таким образом, рассмотреть возможность получения удержание элемента с помощью методов, которые ищут DOM, такие как getElementById, querySelectorAll и т.д.

Updated working example:

function formCheck() { 
    var el = document.querySelectorAll("input[name=name]")[0]; 
    if(el.value == ""){ 
     alert("Je bent vergeten je naam in te vullen"); 
     el.focus(); 
     return false; 
    } 
} 

Answer 3

<form onSubmit= "formCheck()" type="POST" action="#" > 
    <label for="name">Name:</label> 
    <input type="text" name="name" id="name_input" onBlur="formCheck()"> 
    <input type="checkbox" id="valid_name" name="valid_name" disabled> 
    <button type="submit" value="Submit">Submit</button> 
</form> 

function formCheck() { 
    var val = document.getElementById('name_input').value; 
    if(val!='') 
     document.getElementById('valid_name').checked = true; 
    else  
     alert('Looks like you forgot your name!');   
} 

Fiddle : http://jsfiddle.net/dTc63/1/

(Просто нажмите снова запустить, чтобы попробовать другое.POST не работает, как обычно, в jsfiddle.)

Answer 4

Просто передайте это ключевое слово на форму. Проверьте функцию. HTML:

<form onsubmit= "return formCheck(this);" method="POST" action="check.php" > 
name: <input type="text" name="name" onchange="valid_name.checked = true;"> 
<input type="checkbox" disabled="disabled" name="valid_name"> 
<input type="submit" value="Submit"> 
</form> 

JavaScript:

function formCheck(frm) { 
    if(frm.name.value == ""){ 
     alert("You forgot to enter your name"); 
     frm.name.focus(); 
     return false; 
    } 
}