javascript - jQuery 悬停来自 php 生成的 DIV 的多个 ID

Question

我在使用 jQuery 脚本时遇到了一些问题。

我根据 SQL 中的数据使用 PHP 生成了我的 div。

echo "<div class='order' id='a$i' runat='server' draggable='true' >";

鼠标悬停时，它会显示一个同样由 PHP 和 SQL 生成的不同 div。

echo "<div class='position' id='b$i2' runat='server' draggable='true'>";

然后我有一个 jQuery 脚本，它具有第二个 div 的悬停功能。 每个 div 都从 php 获取它的 ID。菜单 div 获取 a1、a2、a3...，悬停 div 获取 b1、b2、b3...

$(function() {

              var moveLeft = 20;
              var moveDown = 10;
              var r = 1;


              $('div#a'+r).hover(function(e) {


                $('div#b'+r).show();

              }, function() {
                $('div#b'+r).hide();

              });

              $('div#a'+r).mousemove(function(e) {
                $("div#b"+r).css('top', e.pageY + moveDown).css('left', e.pageX + moveLeft);

              });

            });

该代码适用于第一个 div，或我使用 r 变量指定的 div。 我在处理页面上所有 ID 的代码时遇到问题。它们是根据 SQL 数据生成的。

https://postimg.org/image/ooqnfkx3n/

有没有办法使用 LOOP 函数来做到这一点？或者从生成的div中获取ID？

感谢您提前提供的所有帮助。

Answer 1

使用开头为选择器

$("div[id^='a']").hover(function(event) {
    //Do your thing
}

文档:Attribute Starts With Selector [name^=”value”]