evt.preventDefault();の反対は何ですか。


185

を起動したevt.preventDefault()後、デフォルトのアクションを再開するにはどうすればよいですか?


3
私は通常、関数が実行されてからデフォルトの動作が実行されると思うので、そもそもevt.preventDefault()を呼び出さないでしょう
Prescott

1
重複の可能性はありますか?:stackoverflow.com/questions/1551389/...
のび太

2
@のび太-私はよくわかりません...それはjQueryに固有のものです。
gilly3

1
うわー、迅速な対応に感謝します!しかし、私の問題は、私がevt.preventDefault();を起動したのではないことです。ライトボックスでサードパーティのフラッシュアプ​​リケーションを実行しています。ライトボックスを閉じると、ページスクロール用のマウスホイールが停止します。いくつかの調査を行ったところ、このFlashアプリでは、ズーム機能のためにページのスクロールが無効になっていることがわかりました。アプリを閉じたら、ページのスクロールを再開しようとしています。たぶん、マウスホイールイベントを再開するために呼び出すことができるいくつかのメソッドがありますか?
ブライアン

回答:


90

@Prescottによるコメントのとおり、その逆:

evt.preventDefault();

になり得る:

本質的には「デフォルトを実行する」と同じです

それ以外の場合は、別のコメントと回答によって提供される回答を紹介する傾向があります。

event.preventDefault()を呼び出しているリスナーをアンバインドする方法(jQueryを使用)?

event.preventDefaultを再度有効にする方法は?

2つ目は、redsquareによって提供されたサンプルソリューションで受け入れられていることに注意してください(これが重複として閉じられない場合の直接的なソリューションとしてここに投稿されています)。

$('form').submit( function(ev) {
     ev.preventDefault();
     //later you decide you want to submit
     $(this).unbind('submit').submit()
});

ありがとうございました!これについてしばらく頭を悩ませていました(フォームを送信する前にいくつかのことをやめて確認する必要がありました。特定の状況では送信せず、他では送信しませんでした)。
Katharine Osborne

1
それは機能しますが、次のフォーム送信が関数を再び呼び出す理由がわかりません、私はそれを確実にアンバインドすると思いましたが、現在の呼び出しに対してのみアンバインドされているようです...私はそれを説明することはできません、それはしますまさに私が欲しいものですが、私が期待していたものではありません。
Vadorequest 2018年

53
function(evt) {evt.preventDefault();}

そしてその反対

function(evt) {return true;}

乾杯!


8
これは私にとってはうまくいきましたが、なぜ誰かがそれをもう少し上手に説明できるのでしょうか?
edhedges 2013年

11
これはpreventDefault()を取り消すことはありreturn trueません。実際には、:を省略した場合と同じです。
br4nnigan

19

clickjQueryのイベントからのリンクを続行する前にコマンドを処理するには:

例えば: <a href="http://google.com/" class="myevent">Click me</a>

jQueryによる防止とフォロースルー:

$('a.myevent').click(function(event) {
    event.preventDefault();

    // Do my commands
    if( myEventThingFirst() )
    {
      // then redirect to original location
      window.location = this.href;
    }
    else
    {
      alert("Couldn't do my thing first");
    }
});

または単にwindow.location = this.href;後に実行しますpreventDefault();


3
そうですが、これはpreventDefaultがリンクであることを前提としており、ドキュメントの本文でのtouchmoveとは言いません。
バンコクの2015

4
これは質問されたものではありません。
Matt Fletcher

8

非同期呼び出しを実行するために、jQueryでのフォーム送信を遅らせる必要がありました。ここに簡略化したコードがあります...

$("$theform").submit(function(e) {
    e.preventDefault();
    var $this = $(this);
    $.ajax('/path/to/script.php',
        {
        type: "POST",
        data: { value: $("#input_control").val() }
    }).done(function(response) {
        $this.unbind('submit').submit();
    });
});

このシナリオの別のオプションは、input type = "submit"を使用してsubmitイベントにバインドする代わりに、input type = "button"を使用してクリックイベントにバインドすることです。
Strixy 2013年

8

OK !クリックイベントで機能します。

$("#submit").click(function(e){ 

   e.preventDefault();

  -> block the click of the sumbit ... do what you want

$("#submit").unbind('click').click(); // the html click submit work now !

});


4

次のパターンを提案します。

document.getElementById("foo").onsubmit = function(e) {
    if (document.getElementById("test").value == "test") {
        return true;
    } else {
        e.preventDefault();
    }
}

<form id="foo">
    <input id="test"/>
    <input type="submit"/>
</form>

...私が何かを逃していない限り。

http://jsfiddle.net/DdvcX/


4

event.preventDefault()なぜevent.preventDefault()それを呼び出すときに最初に何をする必要があるのか​​を理解しなければならないという反対の方法はありません。

内部では、preventDefaultの機能は基本的にfalseを呼び出し、それ以降の実行を停止します。Javascriptの古い方法に慣れている場合、フォーム送信やreturn trueを使用するボタンなどのイベントをキャンセルするためにreturn falseを使用するのがかつての方法でした(jQueryが登場する前)。

上記の簡単な説明に基づいてすでに理解している可能性があるので、反対のことevent.preventDefault()は何もありません。イベントを防止しないでください。デフォルトでは、イベントを防止しない場合、ブラウザはイベントを許可します。

説明については、以下を参照してください。

;(function($, window, document, undefined)) {

    $(function() {
        // By default deny the submit
        var allowSubmit = false;

        $("#someform").on("submit", function(event) {

            if (!allowSubmit) {
                event.preventDefault();

                // Your code logic in here (maybe form validation or something)
                // Then you set allowSubmit to true so this code is bypassed

                allowSubmit = true;
            }

        });
    });

})(jQuery, window, document);

上記のコードでは、allowSubmitがfalseかどうかを確認していることがわかります。つまり、フォームを使用してフォームが送信されないようにしてからevent.preventDefault、検証ロジックを実行し、問題がなければ、allowSubmitをtrueに設定します。

これは、実際には反対のことを行う唯一の効果的な方法event.preventDefault()です。基本的に同じことを達成するイベントを削除することもできます。


4

ここに便利なものがあります...

まず、リンクをクリックし、コードを実行してから、デフォルトのアクションを実行します。これは、event.currentTargetを使用して可能になります。ここでは、新しいタブでGoogleにアクセスしようとしますが、その前にコードを実行する必要があります。

<a href="https://www.google.com.br" target="_blank" id="link">Google</a>

<script type="text/javascript">
    $(document).ready(function() {
        $("#link").click(function(e) {

            // Prevent default action
            e.preventDefault();

            // Here you'll put your code, what you want to execute before default action
            alert(123); 

            // Prevent infinite loop
            $(this).unbind('click');

            // Execute default action
            e.currentTarget.click();
        });
    });
</script>

2

これは私がそれを設定するために使用したものです:

$("body").on('touchmove', function(e){ 
    e.preventDefault(); 
});

そしてそれを元に戻すには:

$("body").unbind("touchmove");

2

ここでは解決策のどれも役に立たず、状況を解決するためにこれを行いました。

<a onclick="return clickEvent(event);" href="/contact-us">

そして機能clickEvent()

function clickEvent(event) {
    event.preventDefault();
    // do your thing here

    // remove the onclick event trigger and continue with the event
    event.target.parentElement.onclick = null;
    event.target.parentElement.click();
}

2

「反対」はイベントをシミュレートすることだと思います。あなたは使うことができます.createEvent()

Mozillaの例を次に示します。

function simulateClick() {
  var evt = document.createEvent("MouseEvents");
  evt.initMouseEvent("click", true, true, window,
    0, 0, 0, 0, 0, false, false, false, false, 0, null);
  var cb = document.getElementById("checkbox"); 
  var cancelled = !cb.dispatchEvent(evt);
  if(cancelled) {
    // A handler called preventDefault
    alert("cancelled");
  } else {
    // None of the handlers called preventDefault
    alert("not cancelled");
  }
}

参照:document.createEvent


jQueryには.trigger()、要素でイベントをトリガーできるようになっているものがあります。

$('#foo').bind('click', function() {
      alert($(this).text());
});

$('#foo').trigger('click');

1

jquery on()は、これに対する別の解決策になる可能性があります。名前空間の使用に関しては、特別に。

jquery on()は、(bind()の代わりに)イベントをバインドする現在の方法にすぎません。off()はこれらをアンバインドすることです。名前空間を使用する場合、複数の異なるイベントを追加および削除できます。

$( selector ).on("submit.my-namespace", function( event ) {
    //prevent the event
    event.preventDefault();

    //cache the selector
    var $this = $(this);

    if ( my_condition_is_true ) {
        //when 'my_condition_is_true' is met, the binding is removed and the event is triggered again.
        $this.off("submit.my-namespace").trigger("submit");
    }
});

名前空間を使用すると、これらのイベントを複数追加して、必要に応じてそれらを削除できます。送信は最良の例ではないかもしれませんが、これはクリックやキープレスなどで便利です。


1

これは質問に対する直接の回答ではありませんが、誰かを助けるかもしれません。すべてのケースでpreventDefault()を呼び出すとイベントが発生する意味がないため、いくつかの条件に基づいてpreventDefault()のみを呼び出すことが重要です。したがって、if条件を設定し、条件が満たされた場合にのみpreventDefault()を呼び出すと、他の場合でも通常の方法で関数が機能します。

$('.btnEdit').click(function(e) {

   var status = $(this).closest('tr').find('td').eq(3).html().trim();
   var tripId = $(this).attr('tripId');

  if (status == 'Completed') {

     e.preventDefault();
     alert("You can't edit completed reservations");

 } else if (tripId != '') {

    e.preventDefault();
    alert("You can't edit a reservation which is already attached to a trip");
 }
 //else it will continue as usual

});


0

「preventDefault」メソッドの後にこれを使用できます

//ここでevt.targetはデフォルトのイベントを返します(例:デフォルトURLなど)

var defaultEvent=evt.target;

//ここでデフォルトのイベントを保存します。

if("true")
{
//activate default event..
location.href(defaultEvent);
}

0

スクリプトの一部のクリックイベントに添付されたこれをいつでも使用できます。

location.href = this.href;

使用例は次のとおりです。

jQuery('a').click(function(e) {
    location.href = this.href;
});

-1

このコードは私が使用した後にイベントを再インスタンス化するのに役立ちました:

event.preventDefault(); to disable the event.


event.preventDefault = false;

-2

次のコードを使用しました。それは私にとってはうまくいきます。

$('a').bind('click', function(e) {
  e.stopPropagation();
});

2
jQuery APIのドキュメント説明されているように、これにより、イベントがDOMツリーで発生しなくなり、親ハンドラーにイベントが通知されなくなります。これはと同じではありませんevent.preventDefault()
ᴍᴀᴛᴛʙᴀᴋᴇʀ

2
これも、質問の答えではありません。
Matt Fletcher
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.