Как предотвратить непрерывное срабатывание функции onmouseover

Question

При наведении мыши на кнопку, функция, активируемая onmouseover, срабатывает непрерывно каждую долю секунды.Я хочу, чтобы он срабатывал только один раз.

Мне нужно использовать onmouseover на кнопке для вызова функции отправки, потому что я не могу использовать onclick, потому что она мешает другой функции, которая вызывается onclick.Если я использую onmouseout, он работает нормально и срабатывает только один раз, но onmouseout не подходит для моих целей.Я пробовал другие обработчики событий, включая onmouseenter и onmousedown, но они страдают от той же проблемы.Я также попробовал это: onmouseover = "submitForm (); button.onmouseover = null;"

<script language="javascript" type="text/javascript">
function submitForm() {

 $("#pform").submit();

}
</script>

<input type="button" onmouseover="submitForm();" />

Когда кнопка наведена, функция срабатывает непрерывно, несколько раз в секунду.Я хочу, чтобы он выстрелил только один раз.

Answer 1

Вы можете использовать простую логику, чтобы проверить, вводится ли указатель мыши над событием в первый раз.Используйте локальное хранилище, если локальное хранилище не задано изначально, это событие первого раза при наведении курсора мыши.

В противном случае, если локальное хранилище уже установлено в значение true, не инициируйте отправку формы.

<script language="javascript" type="text/javascript">
function submitForm() {

if(sessionStorage.getItem("mouse_over") == undefined){

 sessionStorage.setItem("mouse_over","true");
 $("#pform").submit();

}else{

}

}
</script>

<input type="button" onmouseover="submitForm();" />

Answer 2

Это работает.Я думаю, что проблема заключалась в дополнительном эхо-заявлении, которое я поместил в checkstatus.php для тестирования.

<script>
function checkLoginStatus() {

    jQuery.ajax({
            type: "POST",
            url: "checkstatus.php",
            success: function(res){
                if(res == "0") {
                     alert("need to log in"); 
                }
            }
    });
}

</script>

<?php
  session_start();

  if(isset($_SESSION["username"]))
  {
     echo "1";
  } else {
     echo "0";
  }
 ?>

    <?php
      session_start();

      if(isset($_SESSION["username"]))
      {
         echo "1";
      } else {
         echo "0";
      }
     ?>

Это обеспечивает сообщение о невозможности войти в систему, и я могу отправить его с помощью onmouseout, так что все в порядке.Спасибо всем.

Answer 3

Вы пытались добавить переменную, чтобы отслеживать, отправили ли вы уже?Например:

<script language="javascript" type="text/javascript">
var formSubmitted = false;
function submitForm() {
  if (!formSubmitted){
    $("#pform").submit();
    formSubmitted = true;
  }
}
</script>

<input type="button" onmouseover="submitForm();" />

Это должно гарантировать, что это происходит только один раз (даже если submitForm() вызывается много раз).

Answer 4

Адмираалит - я пробую ваше последнее предложение.Это клиентская сторона, называемая onmouseover

    <script>
    function checkLoginStatus() {
        jQuery.ajax({
                type: "POST",
                url: "checkstatus.php",
                success: function(res){
                    if(res == "0") {
                         alert("Login Required"); 
                    }
                }
        });
    }
    </script>
and this is checkstatus.php

    <?php
      session_start();
    echo "checking status";
      if(isset($_SESSION["username"]))
      {
         echo "1";
      } else {
         echo "0";
      }
     ?>

. Я проверил с помощью окна предупреждения, что вызывается checkLoginStatus (), но в противном случае ничего не происходит.Что не так?

Answer 5

Видимо, когда вы отправляете форму, страница перезагружается.После перезагрузки мышь все еще находится на кнопке, и событие запускается снова.

Для отправки формы не принято использовать onmouseover.Вы написали, что не используете onclick, потому что это мешает другой функции, которая называется onclick.Если это единственная причина, попробуйте предотвратить помехи следующим образом.

Измените кнопку следующим образом:

<input type="button" id="clickbutton" />

Найдите $(document).ready(function() { ... }); всвою страницу и добавьте следующий код:

$("#clickbutton").click(function(e) {
  e.stopPropagation();
  $("#pform").submit();
});

Answer 6

$(element).one('mouseover' function(){
 // your function here 
});