onclickが実行された場合、どうすればHREFを無効にできますか？

と属性の両方が 設定されたアンカーがHREFありONCLICKます。クリックしてJavascriptが有効になっている場合は、実行して無視するだけです。同様に、JavaScriptが無効またはサポートされていない場合は、URL をたどって無視します。以下は、JSを実行してリンクを同時にたどる（通常はJSが実行され、次にページが変更される）私がやっていることの例です。ONCLICKHREFHREFONCLICK

<A HREF="http://example.com/no-js-login" ONCLICK="yes_js_login()">Log in</A>

これを行うための最良の方法は何ですか？

私はJavaScriptの回答を期待していますが、特にPHPで実行できる場合は、それが機能する限り、どのような方法でも受け入れます。「a hrefリンクが実行され、JavaScriptのonclick関数が終了する前にページをリダイレクトする」を既に読んだがHREF、遅延するだけで、完全に無効化されていない。もっと簡単なものも探しています。

onclick属性の最初にreturnを配置すると、最初の未編集のソリューションを使用できます。

<a href="https://example.com/no-js-login" onclick="return yes_js_login();">Log in</a>

yes_js_login = function() {
     // Your code here
     return false;
}

例：https : //jsfiddle.net/FXkgV/289/

    yes_js_login = function() {
         // Your code here
         return false;
    }

falseを返すと、デフォルトのアクション（hrefに移動）が阻止されます。

編集：申し訳ありませんが動作しないようです、代わりに次の操作を行うことができます：

<a href="http://example.com/no-js-login" onclick="yes_js_login(); return false;">Link</a>

を使用してデフォルトのブラウザ動作を無効にし、HTML内でpreventDefaultを渡しeventます。

<a href=/foo onclick= yes_js_login(event)>Lorem ipsum</a>

yes_js_login = function(e) {
  e.preventDefault();
}

<a href="http://www.google.com" class="ignore-click">Test</a>

jQueryを使って：

<script>
    $(".ignore-click").click(function(){
        return false;
    })
</script>

JavaScriptを使って

<script>
        for (var i = 0; i < document.getElementsByClassName("ignore-click").length; i++) {
            document.getElementsByClassName("ignore-click")[i].addEventListener('click', function (event) {
                event.preventDefault();
                return false;
            });
        }
</script>

.ignore-click好きなだけ要素にクラスを割り当て、それらの要素をクリックしても無視されます

次の簡単なコードを使用できます。

<a href="" onclick="return false;">add new action</a><br>

次のようなイベントパラメータを渡すと、より簡単です。

<a href="#" onclick="yes_js_login(event);">link</a>

function yes_js_login(e) {
    e.stopImmediatePropagation();
}

これは役立つかもしれません。 JQueryは不要

<a href="../some-relative-link/file" 
onclick="this.href = 'https://docs.google.com/viewer?url='+this.href; this.onclick = '';" 
target="_blank">

このコードは次のことを行います。相対リンクをGoogleドキュメントビューアに渡します。

1. アンカーのフルリンクバージョンを取得する this.href
2. リンクを新しいウィンドウで開きます。

だからあなたの場合これはうまくいくかもしれません：

<a href="../some-relative-link/file" 
onclick="this.href = 'javascript:'+console.log('something has stopped the link'); " 
target="_blank">

通常のURLまたはJavaScript呼び出しを代替的に処理する要素のテンプレートが必要な状況を解決しました。この場合、js関数は呼び出し元要素への参照を必要とします。JavaScriptでは、「this」は、ボタンなどのフォーム要素のコンテキストでのみ自己参照として機能します。ボタンは欲しくなかった。通常のリンクの外観だけだ。

例：

<a onclick="http://blahblah" href="http://blahblah" target="_blank">A regular link</a>
<a onclick="javascript:myFunc($(this));return false" href="javascript:myFunc($(this));"  target="_blank">javascript with self reference</a>

href属性とonClick属性は同じ値ですが、JavaScript呼び出しの場合は、onClickに「return false」を追加します。呼び出された関数で「falseを返す」ことは機能しませんでした。

これは私のために働きました：

<a href="" onclick="return false;">Action</a>

私の場合、ユーザーが「a」要素をクリックしたときに条件がありました。状態は：

他のセクションに10を超える項目がある場合、ユーザーは他のページにリダイレクトされません。

他のセクションの項目が10未満の場合、ユーザーは他のページにリダイレクトされます。

「a」要素の機能は、他のコンポーネントによって異なります。クリックイベント内のコードは次のとおりです。

var elementsOtherSection = document.querySelectorAll("#vehicle-item").length;
if (elementsOtherSection> 10){
     return true;
}else{
     event.preventDefault();
     return false;
}