In rails-Controller, wie Sie verhindern, dass doppelt Einreichen (wenn der Benutzer die double-clic-senden-Schaltfläche oder drücken Sie die EINGABETASTE zweimal)?

Ich benutze 4 Methode für die 4 Szenarien, bitte zunächst lieber mein awnser hier: Verhindern Doppel-legt in einer Rails AJAX form

nur auf-Einschränkung für Benutzer:

verwenden stopImmediatePropagation und hinzufügen eine click-Ereignis, um das Ziel dom.

  /**
   * 防止按钮重复点击。
   * NOTICE: #1 需要在作用点之前调用此方法 #2 stopImmediatePropagation 会阻止后面的所有事件包括事件冒泡
   * @delay_duration 两次点击的间隔时间
   */
  $.fn.preventMultipleClick = function (delay_duration) {
    delay_duration = delay_duration || 3000;
    var last_click_time_stamp = 0;
    var time_duration = 0;
    $(this).bind('click', function (event) {
      time_duration = last_click_time_stamp ? event.timeStamp - last_click_time_stamp : 0;
      //console.debug("preventMultipleClick", last_click_time_stamp, time_duration);
      if (time_duration && time_duration < delay_duration) {
        event.stopImmediatePropagation();
      } else {
        //console.debug("skip preventMultipleClick~");
        last_click_time_stamp = event.timeStamp;
      }
    });
  };

Begrenzung der Einreichen wie ajax:

ajax verwenden, ist beforeSend attribut.

  /**
   * 使用：
   *   在jquery的ajax方法中加入参数:beforeSend
   *   例如：beforeSend: function(){return $.preventMultipleAjax(event, 5000)}
   *
   * @param event
   * @param delay_duration
   * @returns {boolean}
   */
  $.preventMultipleAjax = function (event, delay_duration) {
    delay_duration = delay_duration || 3000;
    var target = $(event.target);
    var last_click_time_stamp = target.attr("_ajax_send_time_stamp") || 0;
    var time_duration = last_click_time_stamp ? event.timeStamp - last_click_time_stamp : 0;
    //console.debug("preventMultipleAjax", last_click_time_stamp, time_duration);
    if (time_duration && time_duration < delay_duration) {
      return false;
    } else {
      //console.debug("skip preventMultipleAjax~");
      target.attr("_ajax_send_time_stamp", event.timeStamp);
      return true;
    }
  };

nur für die form:

<%= f.submit "Save annotation", :disable_with => "Saving...", :class => "btn btn-primary", :id => "annotation-submit-button" %>

oder:
deaktivieren：仅仅对表单元素，按钮等起作用，会阻止其上的事件触发

<input type="submit" value="submit" />
<input type="button" value="button" />
<input type="image" value="image" />

andere:

Dies ist die gem：https://github.com/mlanett/redis-lock

Redis.current.lock("#{current_user.id}.action_name") do
   # Some code
end

Hier ist, was ich tun würde:

1. Fügen Sie ein "token" - Feld, um ein Objekt in der db, die geändert werden.
2. Setzen, dass der token in einer form, die ändert, sagte Objekt.
3. Recht nach der änderung speichern Sie das Objekt mit NEUEN token.
4. Verwenden Sie das token in anderen Seitenaufrufe.

Dies wird nicht verhindern, dass doppelte Unterwerfung, aber zumindest wird verhindert, dass die änderungen von der zweiten zu Begehen. I. e. wenn der Benutzer das Formular absendet zweiten mal der code prüft die eingereichten token gegen die man in der Datenbank und wenn Sie nicht übereinstimmen - tun Sie das nicht, ein update auf das Objekt.

Dies hat auch das zeichnen wieder für neu erstellte Objekte (d.h., wenn der Benutzer will, um einen Kommentar zu erstellen oder etwas wie das). Aber in diesem Fall möchten Sie vielleicht zu prüfen, die Schaffung Zeitintervall vom gleichen Benutzer-und wenn es weniger als sagen wir 5 Sekunden, und Sie würde verhindern, dass das Objekt "erstellt".

1) Es ist schön, zeigen auch einige Statusanzeige zu lassen Benutzer wissen, dass etwas passiert, dass Ihre Anfrage bearbeitet wird. Es sollte beseitigt viele doppelte unterwirft.

2) Wenn Benutzer javascript deaktiviert, wie Sie sind gonna senden "ajaxified" Formen? Wenn die Website wird nicht funktionsfähig ohne javascript, dann ist es wahrscheinlich am besten, einfach Benutzer informieren, dass die (wie Eimantas schlägt).

Bearbeiten
Ein Beispiel für einen solchen Indikator, nur klar zu sein, was ich meine, in 1.

http://www.netzgesta.de/busy/

Ich zufällig das gleiche problem und habe es gelöst mit einer sehr einfachen Art und Weise(vielleicht ist es nicht die richtige oder es existiert etwas buggy konnte ich nicht feststellen, informieren Sie mich bitte, wenn du herausgefunden hast)

Hier ist meine Antwort:

$submitButton.on('click', function(e) {
  setTimeout(() => {
    $(this).attr('disabled', '');
  }, 0);
});

Die wichtigste Frage, die ich konfrontiert war, war, dass wenn ich Doppelklick auf mein original-Taste, es würde abschicken zweimal und verursacht etwas unberechenbar, so habe ich versucht zu blockieren, die Schaltfläche mit "disabled" - Attribut rechts, nachdem Sie es anklicken. Hier ist, was ich schrieb.

//!!this is an incorrect example!!
$submitButton.on('click', function(e) {
    $(this).attr('disabled', '');
});
//!!don't copy this!!

Das größte problem, das ich konfrontiert war, ist, dass wenn ich Sie einfach deaktivieren Sie die senden-Schaltfläche nach rechts klicken auf die submit-Anfrage wird nicht reichen und die Seite wird gerade da hängen, wie immer nix passiert.

Ich denke, die Ursache ist, dass das "disabled" - Attribut verhindert, dass die Anfrage Absenden, Einreichen.(Ich habe zwar keine Ahnung, was die Beziehung zwischen diesen beiden (...)

So, ich denke, das deaktivieren-Ereignis ausgeführt werden soll nach submit-Ereignis.

Soweit ich das verstanden habe, Formular Absenden wird ein Javascript-event-und setTimeout ist eine asynchrone Methode. Als Javascript ausführt, basierend auf Ereignis-Schleife die ajax-Ereignis am Ende der Veranstaltung quene, und werden nur dann ausgeführt, nachdem alle der sync-events fertig stellen.

In meinem code, nach dem ersten Klick auf die Absenden-Schaltfläche wird deaktiviert, nach 0 Millisekunden, die für Menschen unmöglich ist, um auf das zweite mal, problem gelöst!