scr*_*apy 12 javascript confirm
类型apple在其名称是输入goods和类型9在其名称输入price,点击submit,现在确认窗口弹出,无论你点击yes或no,数据将发送到price.php.
我的期望:
当你点击时yes,数据会发送到price.php,当你点击时no,数据不会发送到price.php,我的js有什么问题？
ob = document.getElementById("submit");
function check(){
if(document.getElementById("price").value < 10){
var flag = window.confirm(" are your sure the price is less than 10 ?");
if(flag){
return true;
}else{
exit;
}
}
}
ob.addEventListener("click",check,false);
<form action="price.php" method="post">
<table>
<tr>
<td>goods</td>
<td><input type="text" name="goods"></td>
</tr>
<tr>
<td>price</td>
<td><input type="text" id="price" name="price"></td>
</tr>
<tr><td colspan=2><input type="submit" id="submit" value="submit"></td></tr>
</table>
</form>
该price.php是简单的.
<?php
var_dump($_POST);
?>
在exit下面无法阻止发送到表单数据price.php.
if(flag){
return true;
}else{
exit;
}
改变exit;成没有用 return false;.将js更改为以下内容也没有用.
ob = document.getElementById("submit");
function check(){
if(document.getElementById("price").value < 10){
var flag = window.confirm(" are your sure the price is less than 10 ?");
if(flag){
return true;
}else{
exit;
}
}
}
ob.addEventListener("submit",check,false);
传统方式与此相同The KNVB,关键<form action="price.php" method="post" onsubmit="return check()">在于将表单属性onsubmit与函数绑定check.
DOM0级别的事件方式,与传统方式几乎相同.
<html>
<body>
<form action="price.php" method="post" id="form">
<table>
<tr>
<td>goods</td>
<td><input type="text" name="goods"></td>
</tr>
<tr>
<td>price</td>
<td><input type="text" id="price" name="price"></td>
</tr>
<tr><td colspan=2><input type="submit" id="submit" value="submit"></td></tr>
</table>
</form>
<script>
var ob = document.getElementById('submit');
ob.onclick =function(){
if(document.getElementById("price").value < 10){
var flag = window.confirm(" are your sure the price is less than 10 ?");
if(flag){
return true;
}else{
return false;
}
}
}
</script>
</body>
</html>
OP期望的是DOM2级事件方式.
<html>
<body>
<form action="price.php" method="post" id="form">
<table>
<tr>
<td>goods</td>
<td><input type="text" name="goods"></td>
</tr>
<tr>
<td>price</td>
<td><input type="text" id="price" name="price"></td>
</tr>
<tr><td colspan=2><input type="submit" id="submit" value="submit"></td></tr>
</table>
</form>
<script>
var ob = document.getElementById('submit');
function check(event){
console.log(ob.type);
if(document.getElementById("price").value < 10){
var flag = window.confirm(" are your sure the price is less than 10 ?");
if(flag){
ob.submit();
return true;
}else{
event.preventDefault();
return false;
}
}
}
ob.addEventListener("click",check);
</script>
</body>
</html>
关键点DOM2 level event way是:
1.旗帜是真的
if(flag){
ob.submit();
return true;
}
当国旗是假的时候
else{
event.preventDefault();
return false;
}
| 归档时间： |
|
| 查看次数： |
241 次 |
| 最近记录： |