Question

因此，如果您的鼠标靠近图像，图像将会移动，那么我尝试编写脚本代码。这是我的来源和实时预览。 http://jsfiddle.net/9CDtE/4/ 你能看到一旦你移动它移动的按钮附近，这就是我想要的。但是现在我需要将按钮变成html表单并将按钮变成图像。有没有办法做到这一点？我对jquery不好。

HTML

<button>button</button>

JS

$(function(){
    $("button").on({
        mouseover:function(){
            $(this).css({
                left:(Math.random()*200)+"px",
                top:(Math.random()*200)+"px",
            });
        }
    });
});

CSS

button{
    position:absolute;
    top:10px;
    left:10px;
}

我拥有一个口袋妖怪在线游戏。我想从数据库中抓取一个随机的口袋妖怪（我可以这样做），然后每当用户移动鼠标靠近它并在页面上移动时，就会更换口袋妖怪。所以会有一个html表单，让我们说3个字段，口袋妖怪名称，口袋妖怪ID和口袋妖怪图像。一个页面加载它会自动从数据库中抓取一个随机的口袋妖怪，并在html表单中填写这些隐藏的字段。我能做什么。一旦用户将他的鼠标移动到口袋妖怪/图像附近，它将移动，然后将抓取另一个随机口袋妖怪，并且html表格将变为新的口袋妖怪信息。它将不断变化，直到用户点击图像然后提交表格。

Answer 1

按照上面代码的逻辑而不是css和selector中的按钮。

插入带有特定ID的img。

<img src="" id="cantTouchThis" />

在你的代码中使用cantTouchThis，你的选择器会这样：

$("#cantTouchThis").on({

但是你正在使用一个按钮而你说想要一个图像，但这很令人困惑。您可以随时在按钮后面插入HTML，例如：

$("#cantTouchThis").after('<form>.....</form>');

请详细说明并解释清楚，以获得更好的答案。

趋向于您的更新，这是您想要的：

$(function(){
    $("#cantTouchThis").on({
        mouseover:function(){
            $(this).css({
                left:(Math.random()*200)+"px",
                top:(Math.random()*200)+"px",
            });
            //Go get PHP via jQuery AJAX
            // Grab data and now update your form, or insert form!
            // Insert new form $('#following_around').html('<form>...</form>');
            // Example change directly the "Pokemon" ID in the form, without the need to completely insert a new form
            $('#following_around #random_id').html(Math.random()*10);
        }
    });
});

Jquery移动图像而不是按钮

1 个答案: