我正在尝试使用 jQuery 鼠标悬停更改输入值。
场景:我有 5 个具有不同颜色和用户名的 div。当鼠标悬停在 div 上时,输入文本会根据数据库值更改(对于颜色输入背景颜色)数据,当更改 div 时,文本会显示新数据。
使用 PHP 我回显脚本的一部分来处理鼠标悬停功能
<?php
$myId = '1';
$uname = 'user1';
$ucolor = 'FFFFFF';
echo "<script>
$('$myId').mouseover( function () {
$('#uname').val('" . $uname . "'),
$('#ucolor').val('" . $ucolor ."'),
$('#ucolor').css('background-color', '" . $ucolor . "')
})
</script>";
如果我将 mouseover() 更改为 hover(),但只显示第一个元素,如果我将鼠标悬停在第二个元素上,则数据不会改变。
最佳答案
试试这个:
将脚本放在 body 标签之后:
<body>
<div class="hh" id="1"></div>
<input type="text" id="uname" />
<input type="text" id="ucolor" />
<div class="hh" id="2"></div>
</body>
<?php
$myId = '1';
$uname = 'user1';
$ucolor = 'FFFFFF';
echo "<script>
$('#$myId').mouseover( function () { // add # here
$('#uname').val('" . $uname . "'),
$('#ucolor').val('" . $ucolor ."'),
$('#ucolor').css('background-color', '" . $ucolor . "')
})
</script>";
$myId = '2';
$uname = 'user2';
$ucolor = 'FFF555';
echo "<script>
$('#$myId').mouseover( function () { console.log('fdgfdg')
$('#uname').val('" . $uname . "'),
$('#ucolor').val('" . $ucolor ."'),
$('#ucolor').css('background-color', '" . $ucolor . "')
})
</script>";
?>
关于javascript - jQuery 在 div 鼠标悬停时更改输入值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37188411/