重述:
有一个 php 变量: $地址
有一个表单变量 爸爸
如果用户输入表单变量的值与 php 变量不匹配,我想在页面上显示一个跨度
例如,$address 变量 = "123 4th St"
用户在 addy 表单字段中输入“132 4th St”
一旦用户单击字段外(文本输入),因为地址不匹配,我希望显示 span id add_ck,“地址不匹配”
但是如果用户将 addy 的内容更改回“123 4th St”,span id add_ck 将不会显示任何内容,或者“”。
我知道你可以使用 onchange 事件来执行显示/隐藏操作,并且我之前已经在下拉菜单中使用过它。但是,将文本输入“更改”(通过单击字段外部或进入其他字段来确定)与 php 变量进行比较以触发跨度显示/不显示事件是我试图找出的内容。
这是我迄今为止尝试过的:
<?
$address = "123 4th St";
?>
<html>
<head>
<script>
var db_address = '<?php echo $address; ?>';
document.getElementById('address_field').addEventListener("change", function(){
compare_addresses();
});
var compare_addresses = function(){
var new_address = document.getElementById('address_field').value;
var the_span = document.getElementById('add_ck');
if(db_address == new_address)
{
//The addresses are equal. Show 'add_ck'.
add_ck.style.display = 'block';
}
else
{
//The addresses are not equal. Hide'add_ck'.
add_ck.style.display = 'none';
}
}
</script>
</head>
<body>
<form name="form" method="POST" action="">
<input type="text" name="addy" id="address_field">
<input type="submit">
</form>
<span id="add_ck">Testing</span>
</body>
</html>
最佳答案
首先,您的输入字段应该有一个 id。假设我们将其命名为 address_field
:
<input type="text" name="addy" id="address_field">
将 PHP 中的值放入 JS 变量中:
var db_address = '<?php echo $address; ?>';
向文本框添加事件监听器:
document.getElementById('address_field').addEventListener("change", function(){
compare_addresses();
});
在 compare_addresses
函数中比较两个字符串:
var compare_addresses = function(){
var new_address = document.getElementById('address_field').value;
var the_span = document.getElementById('add_ck');
if(db_address == new_address)
{
//The addresses are equal. Show 'add_ck'.
the_span.style.display = 'block';
}
else
{
//The addresses are not equal. Hide'add_ck'.
the_span.style.display = 'none';
}
}
关于javascript - 使用 javascript 将数据库中的 php 变量与表单字段 onchange 进行比较,并相应地显示/隐藏跨度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37952550/