115

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

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

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

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

4

10 に答える 10

72

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/

于 2014-03-28T21:14:21.350 に答える
63 
    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>
于 2013-03-25T18:41:36.580 に答える
41

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

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

yes_js_login = function(e) {
  e.preventDefault();
}
于 2016-05-23T13:56:56.990 に答える
19 
<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クラスを好きなだけ要素に割り当てると、それらの要素のクリックは無視されます

于 2015-12-20T22:21:23.967 に答える
15

この単純なコードを使用できます。

<a href="" onclick="return false;">add new action</a><br>
于 2016-04-26T06:36:09.027 に答える
6

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

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

function yes_js_login(e) {
    e.stopImmediatePropagation();
}
于 2015-06-05T17:32:30.923 に答える
5

javascript:void(0)次のように使用してみてください-

<a href="javascript:void(0)" onclick="...">Text</a>

于 2020-12-01T09:11:37.503 に答える
2

これは役立つかもしれません。 JQueryは必要ありません

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

このコードは次のことを行います。相対リンクをGoogleDocsViewerに渡します

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

したがって、あなたの場合、これはうまくいくかもしれません：

<a href="../some-relative-link/file" 
onclick="this.href = 'javascript:'+console.log('something has stopped the link'); " 
target="_blank">
于 2013-11-15T05:04:34.900 に答える
1

通常の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に「returnfalse」を追加します。呼び出された関数に「returnfalse」があると機能しませんでした。

于 2014-08-18T09:24:55.213 に答える
0

私の場合、ユーザーが「a」要素をクリックしたときに条件が発生しました。条件は次のとおりです。

他のセクションに10を超えるアイテムがある場合、ユーザーは他のページにリダイレクトされるべきではありません。

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

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

var elementsOtherSection = document.querySelectorAll("#vehicle-item").length;
if (elementsOtherSection> 10){
     return true;
}else{
     event.preventDefault();
     return false;
}
于 2017-10-11T19:40:01.923 に答える