当我想向用户传达有关其输入的错误消息时,我想告知他们错误但是保持已填写/选择的所有字段值。尽管使用js警告框可以实现这一点,但警报框下方仍无法看到php页面,直到警报确认并且警报框显得很丑陋。
相反,我更喜欢使用类似的东西:
echo "<fieldset id='fieldsetErr'>
<legend id='legendErr'>Error:</legend>
<p id='pErr'>" . $errMsg . "
<br><br>
<span style='padding-left:200px'>
<a href='searchCriteria.php'>
<button>Clear</button>
</a>
</span>
</p>
</fieldset>";
使用CSS:
#fieldsetErr {
width: 500px;
background:
url(images/logo.jpg)
top center / 300px 300px
no-repeat
fixed
padding-box
content-box
red;
color: white;
}
#legendErr {
font-size: 20px;
color: white;
text-shadow: 1px 1px 2px black, 0 0 25px red, 0 0 5px red;
}
#pErr {
margin-left: 20px;
}
此字段集错误消息与页面的其余部分很好地集成。不幸的是,当点击“清除”按钮时,会加载一个新的searchCriteria.php实例,并且所有用户以前的输入都会丢失。
如果我只是删除Clear按钮以及清除错误消息的选项,则用户的输入值仍然可以保留,同时可以进行必要的更正并重新提交。但有没有可能让用户在读取之后清除字段集错误消息而不清除他们输入到该点的所有值,如果是这样的话怎么办呢?
更新
我想也许我可以通过在div标签中包装fieldset错误消息来做我想做的事情:
echo '<div id="divErr">
<fieldset id="fieldsetErr">
<legend id="legendErr">Error:</legend>
<p id="pErr">' . $errMsg . '
<br><br>
<span style="padding-left:200px">
<button onclick=<script type="text/javascript">','removeDivErr();','</script>>Clear</button>
</span>
</p>
</fieldset>
</div>';
并在单击“清除”按钮时使用js函数删除fieldset元素:
<script type="text/javascript">
function removeDivErr() {
var elem = document.getElementById('divErr');
elem.parentNode.removeChild(elem);
}
</script>
虽然它不能像粘贴那样工作,但我不确定是否是因为我试图调用/将javascript集成到php echo语句中。我试过用不同的方式引用php echo语句和javascript函数调用,看看我是否可以哄它工作,但到目前为止nadda。任何人都可以确认吗?