JavaScriptでURLに移動するonclick関数を追加しますか?


100

ユーザーがフィールドにカーソルを合わせたときに、この派手な小さなJavaScriptを使用してフィールドを強調表示しています。onclickリンクとして機能する機能を追加してURLに行く方法があるか教えていただけませんか?

<script>
         $(function() {
            $('tr').hover(function() {
                $(this).css('background-color', '#eee');
                $(this).contents('td').css({'border': '0px solid red', 'border-left': 'none', 'border-right': 'none'});
                $(this).contents('td:first').css('border-left', '0px solid red');
                $(this).contents('td:last').css('border-right', '0px solid red');
            },
            function() {
                $(this).css('background-color', '#FFFFFF');
                $(this).contents('td').css('border', 'none');
                $('a#read_message.php').click(function(){ URL(); });
            });
        });
        </script>

URL値を取得する方法は、テーブルセルの1つのリンクですか、それともすべて同じURLに移動しますか
Renon Stewart

2
「#read_message.php」にかなり奇妙なIDがありますか?
Alex Gill

回答:



129

単にこれを使う

onclick="location.href='pageurl.html';"

9
これにより、同じウィンドウ内でリンクが開き、受け入れられた回答が新しいウィンドウで開きます。私はこの答えのアプローチを好む
Hamman Samuel

33

jqueryでユーザーを別のURLに送信するには、次のようにします。

$("a#thing_to_click").on('click', function(){
     window.location = "http://www.google.com/";    
});

この方法も機能しますが、上記は最近のより正しいより新しい方法です

$("a#thing_to_click").click(function(e){
         e.preventDefault();
         window.location = "http://www.google.com/";    
});


8

HTML

<input type="button" value="My Button" 
onclick="location.href = 'https://myurl'" />

MVC

<input type="button" value="My Button" 
onclick="location.href='@Url.Action("MyAction", "MyController", new { id = 1 })'" />

6

リンクを新しいタブで開く場合は、次の方法があります。

$("a#thing_to_click").on('click',function(){
    window.open('https://yoururl.com', '_blank');
});

3

<a>タグを扱っていて、デフォルトへの移行を中断したいhref場合は、this代わりに使用する必要があります。

デフォルトのURLに移動(yahoo):

<a href="https://yahoo.com" onclick="location.href='https://google.com';"> 

新しいURLに移動(Google)onclick

<a href="https://yahoo.com" onclick="this.href='https://google.com';">

を使用thisすることで、現在のブラウザーonclickイベントを中断し、hrefデフォルトの動作に進む前に変更します。<a href='...


こんにちは@Darvydas、上記のコードは期待どおりに機能していますが、ページが読み込まれるまで待機して、新しく読み込まれたURLで別のイベントを実行する方法は?
FayazMd

@FayazMd何をしようとしているのかわからない?通常、それaがWebページとしてDOM内のJavaScript(現在はDOMのelement内)である場合、次のページ(ブラウザーページをリダイレクトしている場所)でのJSの動作を制御できません。ユーザーがページを離れると完了です。2番目のページも制御していない限り、各ユーザーのページの読み込みをリッスンdocument.referrerして、それが適切な人物であるかどうかを確認する必要があります。また、ページのURLの変更をリッスンできるブラウザの拡張機能やアドオンなどを使用している場合も、別の話になるかもしれません。
DarvydasŠilkus1

こんにちは@Darvydas、返信ありがとうございます。以下のように試してみたいと思います。ブラウザコンソールで、JavaScriptを自己実行機能で使用すると、1)WebサイトのURLの1つをロードしたい、2)完全にロードされるまで待機したい、3)そのWebページに必要なテーブルが含まれているすべての行を抽出します。ステップ1を実行できます。既にロードされているWebサイトにいる場合は、コンソールでテーブル行を(JavaScriptコードで)抽出できます。しかし、私はステップ2で失敗し、上記の手順のために順次書き込みコードにしようとしていたときに
FayazMd

2

質問を完全に理解しているとは思いませんが、このような意味ですか?

$('#something').click(function() { 
    document.location = 'http://somewhere.com/';
} );

はい、基本的に、ユーザーがテーブルのコンテンツ/情報の上をスクロール/ホバーすると、JavaScriptがテーブルフィールドを強調表示するように設定されます。ハイライト表示されたフィールドがクリック可能になり、ページにリンクされているように見せたいのですが。それがもっと理にかなっている場合。そうでない場合は申し訳ありません。
ジョンテイラー

解決しました。#を使用する代わりにurコードをわずかに調整しただけで、テーブルを表すためにtrに入れましたが、うまくいきました。感謝
ジョンテイラー

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