如何在悬停时点击按钮

时间:2016-10-11 16:43:58

标签: javascript jquery html

对于你们许多人来说,这个问题听起来很奇怪。我需要一个无法通过点击触发的按钮。这意味着它不会采取行动。就像表单属性action设置为next.html之类的情况一样,点击不会使其转到下一页。

当用户将鼠标悬停在按钮上时,它可以转到下一个站点。我这样做的原因是机器人可以在没有悬停在按钮上的情况下提交数据。我希望这可以防止机器人向我的网站提交任何内容。

我真的没有任何代码,但有没有办法在Javascript / jQuery中执行此操作?

如果这令人困惑,请在评论中提出更多问题,我会尽力回答。

4 个答案:

答案 0 :(得分:1)

  1. 机器人搜索<form>元素
  2. 机器人查询表单的action
  3. 如果您的页面中没有任何表单,则机器人不会关注您的表单action。如果这听起来很奇怪:

    • 使用JS创建整个表单(没有表格?没有机器人。

    无论哪种方式(特别是如果您关心noJS访客),您需要验证表单

    1. 在服务器端(最重要的是)
    2. 在客户端(JavaScript;如果他们忘记填写某些内容,请通知您的用户 - 拼写错误)
    3. <小时/> 您可以在此处找到an approach example

      为什么hover方法/意图不好:

      • 你只是在弄乱UI创建一个糟糕的用户体验。没什么。
      • 页面上已有表格,显示机器人需要的所有内容。
      • 机器人不需要任何按钮来提交表单。
      • 有些用户可能会使用TAB键来关注SUBMIT按钮 - 所以没有任何 悬停 ,只是一个不能用作的差形式这应该。

答案 1 :(得分:1)

现在我不确定这种技术在阻止机器人方面有多么有效。如果你还想试一试,我会做这样的事情:

HTML:

<form class="form" action="1.php" type="post">
  <input type="text">
  <input class="submitbutton" type="submit">
</form>

的Javascript / jQuery的:

var $form = $('.form'),
    $btn = $('.submitbutton');

// Disable submit button on page load
$btn.prop('disabled',true);

// Reactivate submit button on form hover
$form.hover(
  function(e){
    e.stopPropagation();
    $btn.prop('disabled',false);
  }, function(e){
    e.stopPropagation();
    $btn.prop('disabled',true);
  }
);

我把an example at JSFiddle.

放在一起

答案 2 :(得分:0)

通常,单击按钮应提交表单。如果您想强制解决问题,我认为您应该首先尝试禁用该按钮。

<span style="padding: 8px; background: red;"  onmouseout="this.firstChild.disabled='';"><input type="button" name="test" id="test" value="roll over me" onmouseover="this.disabled=true;"></span>

在答案中提供:

Javascript: enable/disable button with mouseover/mouseout

答案 3 :(得分:-1)

似乎您的问题是在没有点击按钮的情况下导航到另一个页面。

         <html>
            <head>
            </head>
            <body>
                <button onmouseover="go()"  id="button">hii</button>
                <script>
                    var anchor=document.createElement("a");
                    var button=document.getElementById("button");
                    anchor.href="alarm2.html";
                    function go()
                    {
                        button.onmouseover= anchor.click();

                    }
                </script>
            </body>
        </html>