web-dev-qa-db-ja.com

HTMLタグ<a>にhrefとonclickの両方を追加したい

HTMLタグについて質問したい

<a href="www.mysite.com" onClick="javascript.function();">Item</a>

この a タグを href および onClick で動作させる方法は？ （onClickを最初に実行してからhrefを実行することをお勧めします）

javascripthtmltagsonclickhref
109
user1589113

構文が少し変更されているだけで、必要なものはすでに揃っています。

<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に従い、イベントをキャンセルします（またはイベントは防止されません）。

205
Ian

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>
10
Sudipta Chatterjee

onclickの代わりにng-clickを使用してください。そしてそれはそれと同じくらい簡単です：

<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>
0
mak-273

これを実現するには、次の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>

これが 作業例です 。

0
Kamil Kiełczewski