innerHTML работает над элементом тела, но не с элементом p

Я хочу отобразить на экране сообщение с сообщением «Пожалуйста, введите действительный адрес электронной почты», если адрес электронной почты недействителен. Оператор innerHTML для элемента body работает нормально, но тот, который я использую для элемента p, не работает.innerHTML работает над элементом тела, но не с элементом p

Когда-то, когда я тестировал его, я увидел сообщение «Пожалуйста, введите действительный адрес электронной почты», а затем после того, как я нажал кнопку «ОК» для «недопустимого» предупреждения, сообщение исчезло.

JavaScript:

<script type="text/javascript">  
function validateEmail() { 
    var emailRule = /^(([^<>()[\]\\.,;:\[email protected]\"]+(\.[^<>()[\]\\.,;:\[email protected]\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 
    if (emailRule.test(document.forms[0].email.value)) { 
     document.getElementById("body").innerHTML = "Thank you for signing up for our newsletter! You will recieve a confirmation email shortly."; 
     setTimeout("window.close()", 3000); 
    } 
    else 
     window.alert("not valid");  //for debugging 
     document.getElementById("message").innerHTML = "Please enter a valid email address"; 
} 
</script>

HTML:

</head> 
<body id="body"> 
<p>If you sign up for our newsletter you will be entered into a drawing to win free clothes every month!</p> 
<br> 
<p id="message"> </p> 
<form action="" onsubmit="validateEmail();"> 
<p>Email: <input type="text" name="email"/> 
<input type="submit" value="Sign up"/></p> 
<br> 
<input type="button" value="No thanks" onclick="window.close()"/> 
<br> 
</form> 
<p><a href="privacy.html">Privacy Policy</a></p> 
</body> 
</html>

источник

2013-04-25 user2234760

Вы знаете, что 'else' не заботится о отступе, только фигурные скобки' {} '? –

Хорошая точка. Я попробую. Затем я снова добавил заявление window.alert, потому что у меня была эта проблема, поэтому я думаю, что проблема все равно будет там. – user2234760

@SimonBoudrias 'if' и' else' отлично работают без '{}', когда в его теле есть только одна строка. – Ian

Форма не представления не Mather, что, потому что вы не предотвратить действие по умолчанию. Вот почему появляется сообщение (рабочий) и исчезают (перезагрузки страницы)

function validateEmail(e) { 
    if(valid) { /* stuff */ } 
    else { 
     e.preventDefault(); // Prevent form submission 
    /* etc */

источник

2013-04-25 15:08:16

Это может сработать, но имейте в виду, что это выполняется в начале функции, поэтому, если проверка прошла успешно, форма должна быть отправлена вручную. – kais

<script type="text/javascript"> 


function validateEmail() { 
    var emailRule = /^(([^<>()[\]\\.,;:\[email protected]\"]+(\.[^<>()[\]\\.,;:\[email protected]\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 

    if (emailRule.test(document.forms[0].email.value)) { 
     document.getElementById("body").innerHTML = "Thank you for signing up for our newsletter! You will recieve a confirmation email shortly."; 
     setTimeout("window.close()", 3000); 
    } 
    else 
    { 
     window.alert("not valid");  //for debugging 
     document.getElementById("message").innerHTML = "Please enter a valid email address"; 
    } 
} 

</script> 

</head> 
<body id="body"> 
<p>If you sign up for our newsletter you will be entered into a drawing to win free clothes every month!</p> 
<br> 
<p id="message"></p> 
<form action="" onsubmit="validateEmail();"> 
<p>Email: <input type="text" name="email"/> 
<input type="submit" value="Sign up"/></p> 
<br> 
<input type="button" value="No thanks" onclick="window.close()"/> 
<br> 
</form> 
<p><a href="privacy.html">Privacy Policy</a></p> 
</body> 
</html>

источник

2013-04-25 15:03:16 Antoine

Это дает мне «неправильное количество аргументов или недопустимое присвоение свойств». – user2234760

Working jsFiddle here.

Во-первых, добавить скобки к вашему другому заявление, если вы собираетесь держать console.log - это могут работать без них, но только для одной строки после нее, тогда как у вас есть две строки после, поэтому innerHTML изменяется независимо от if/else.

Кроме того, добавьте в JavaScript event.preventDefault(), чтобы остановить форму от представления, если происходит утверждение еще:

else { 
    event.preventDefault(); 
    document.getElementById("message").innerHTML = "Please enter a valid email address"; 
}

источник

2013-04-25 15:09:07 lifetimes

Форма подачи независимо от результата заявления. Код работает, но страница перезагружается формой submit. Добавление return false; устраняет проблему:

<script type="text/javascript"> 


function validateEmail() { 
    var emailRule = /^(([^<>()[\]\\.,;:\[email protected]\"]+(\.[^<>()[\]\\.,;:\[email protected]\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; 

    if (emailRule.test(document.forms[0].email.value)) { 
     document.getElementById("body").innerHTML = "Thank you for signing up for our newsletter! You will recieve a confirmation email shortly."; 
     setTimeout("window.close()", 3000); 
    } 
    else 
     window.alert("not valid");  //for debugging 
     document.getElementById("message").innerHTML = "Please enter a valid email address"; 
     return false; // this stops the form from submitting, and the page from reloading. 
} 

</script> 

</head> 
<body id="body"> 
<p>If you sign up for our newsletter you will be entered into a drawing to win free clothes every month!</p> 
<br> 
<p id="message"> </p> 
<form action="" onsubmit="validateEmail();"> 
<p>Email: <input type="text" name="email"/> 
<input type="submit" value="Sign up"/></p> 
<br> 
<input type="button" value="No thanks" onclick="window.close()"/> 
<br> 
</form> 
<p><a href="privacy.html">Privacy Policy</a></p> 
</body> 
</html>

источник

2013-04-25 15:13:12 kais

innerHTML работает над элементом тела, но не с элементом p

ответ

Смежные вопросы