HTMLタグについて質問したい
<a href="www.mysite.com" onClick="javascript.function();">Item</a>
これをhrefとonClickで動作するタグにする方法は?(最初に実行してからhrefを実行することをお勧めします)
HTMLタグについて質問したい
<a href="www.mysite.com" onClick="javascript.function();">Item</a>
これをhrefとonClickで動作するタグにする方法は?(最初に実行してからhrefを実行することをお勧めします)
回答:
必要なものはすでにあり、構文が少し変更されています。
<a href="www.mysite.com" onclick="return theFunction();">Item</a>
<script type="text/javascript">
function theFunction () {
// return true or false, depending on whether you want to allow the `href` property to follow through or not
}
</script>
<a>
タグのonclick
およびhref
プロパティのデフォルトの動作は、を実行しonclick
、が返されないhref
限りに従い、イベントをキャンセルします(または、イベントは防止されていません)。onclick
false
href="#"
実際のURLの代わりにそこに置くまで、私には機能しません。
jQueryを使用します。click
イベントをキャプチャして、Webサイトにアクセスする必要があります。
$("#myHref").on('click', function() {
alert("inside onclick");
window.location = "http://www.google.com";
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="#" id="myHref">Click me</a>
href
属性を追加してください。
これを実現するには、次のhtmlを使用します。
<a href="www.mysite.com" onclick="make(event)">Item</a>
<script>
function make(e) {
// ... your function code
// e.preventDefault(); // use this to NOT go to href site
}
</script>
こちらが動作例です。
<a href="http://example.com" >Item</a>
Chromeでは、ページがこのリンクを実行できるようにするためのメッセージが表示されます(ChromeのURLバーの最後にアラート)。[ブロックされた]のページ:コンソールでのサファリでは、私はwarrning見るfiddle.jshell.net/_displayがから安全でないコンテンツを表示するためには許されなかったexample.comので、おそらくこれは、いくつかのセキュリティ上の問題である(?のみフィドル上) -
jQueryは必要ありません。
この例では、純粋なブラウザのJavaScriptを使用しています。デフォルトでは、クリックハンドラーがナビゲーションの前に評価されるように見えるため、必要に応じてナビゲーションをキャンセルして独自に行うことができます。
<a id="myButton" href="http://google.com">Click me!</a>
<script>
window.addEventListener("load", () => {
document.querySelector("#myButton").addEventListener("click", e => {
alert("Clicked!");
// Can also cancel the event and manually navigate
// e.preventDefault();
// window.location = e.target.href;
});
});
</script>
のng-click
代わりに使用しonclick
ます。そしてそれと同じくらい簡単です:
<a href="www.mysite.com" ng-click="return theFunction();">Item</a>
<script type="text/javascript">
function theFunction () {
// return true or false, depending on whether you want to allow
// the`href` property to follow through or not
}
</script>