使用Jquery Keyup函数将变量从一个输入字段传递到另一个
Using Jquery Keyup function to pass variable from one input field to another
我正在尝试用在另一个字段(位置地址)中输入的值自动填充一个输入字段(位置名称)。我在网上到处看了看,并设法使JS片段在一个简单的例子中工作,但由于某种原因,这不适用于下面的php代码。
只是为了澄清,我希望在"位置地址"中输入的值被传递到"位置名称"
<script>
$('#location-address')
.keyup(function() {
var value = $(this).val();
$('#location-name').text(value);
})
.keyup();
</script>
<tr class="em-location-data-name">
<th style="padding-top: 14px;">
<?php _e ( 'Event unique identifier:', 'dbem' )?>
</th>
<td>
<input id="location-name" type="text" name="location_name" />
</td>
</tr>
<tr class="em-location-data-address">
<th style="padding-top: 14px;">
<?php _e ( 'Address:', 'dbem' )?> </th>
<td>
<input id="location-address" type="text" name="location_address" value="<?php echo esc_attr($EM_Location->location_address, ENT_QUOTES); ; ?>" />
</td>
</tr>
首先,您的代码需要放在document.ready处理程序中。其次,需要使用val()
而不是text()
来设置input
字段的值。
$(function() {
$('#location-address').keyup(function() {
var value = $(this).val();
$('#location-name').val(value);
}).keyup();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table>
<tr class="em-location-data-name">
<th style="padding-top: 14px;">
<?php _e ( 'Event unique identifier:', 'dbem' )?>
</th>
<td>
<input id="location-name" type="text" name="location_name" />
</td>
</tr>
<tr class="em-location-data-address">
<th style="padding-top: 14px;">
<? php _e( 'Address:', 'dbem') ?>
</th>
<td>
<input id="location-address" type="text" name="location_address" value="<?php echo esc_attr($EM_Location->location_address, ENT_QUOTES); ; ?>" />
</td>
</tr>
</table>
您需要将jQuery代码封装在$(document).ready();
中,以便jQuery绑定所有HTML元素。
更正的代码:
<script>
$(document).ready(function(){
$('#location-address').keyup(function() {
var value = $(this).val();
$('#location-name').val( value );
});
}).keyup();
</script>
使用此
<script>
$(document).ready(function(){
$('#location-address').keyup(function() {
var value = $(this).val();
$('#location-name').val( value );
});
});
</script>
相关文章:
- javascript函数,它接受两个输入:一个对象和一个键,并返回对象中该键的相应值
- 用户在文本框中输入一个数字,并根据使用 PHP 输入的数字重定向到另一个网页
- 如何要求用户输入一个介于 1 和 50 之间的整数,然后小程序打印出一行这个星数
- Javascript提示和警报输入一个数字,它将循环,您将输入数字以获得它的平均值
- 如果使用jquery输入一个字段,则自动填充其他字段
- 一直要一个数字,直到输入一个偶数
- 需要用户输入一个随机数,然后提醒用户数字 ibnputted
- 以 jQuery 为中心的文本框在 Safari 中输入一个字符后失去焦点
- 如何将我的 Google 地图功能从自动查找我的位置更改为让我输入一个位置
- 如何让两个不同的输入(一个用于移动设备,一个用于桌面)修改同一变量
- 允许html输入框只输入一个完整的数字和精确的十进制.5
- 我怎样才能使我的表单输入不返回任何结果,当它输入一个空查询
- 用TypeScript输入一个约束字典
- 只有在用户输入一个字符后,AngularJS才会调用数据库
- 在javascript中输入一个正斜杠
- 如何使移动
- 如何确保用户在Javascript中输入一个有效的数字
- Rails 3 -设计'请输入一个电子邮件地址'弹出消息,即使禁用了validatable
- 在输入中输入一个值
- 输入一个返回的可观察对象