2016-11-02 15 views
0

は私のコードです:クリックした要素のhref値を取得するにはどうすればよいですか?ここ

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<script src="https://cdn.rawgit.com/makeusabrew/bootbox/master/bootbox.js"></script> 
 

 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 

 
<a onclick="return bootbox.confirm('are you sure?', function(e){ if (e) {window.location = this.href;} });" href="/Remove-Post/{{ $tb }}/{{$post->id}}" data-toggle="modal" data-target="#confirm-delete">Link</a>

は私がconfirmのためthis libraryを使用することを指摘しました。

しかし、この行は私のコードでは動作しません:

window.location = this.href; 

そして、それは常に(I OKをクリックする)私はここにリダイレクトします。

http://localhost:8000/undefined 

がどのように修正することができますそれ?

+0

$ tbは未定義です。テンプレートエンジンまたはフレームワークを使用していますか? –

+0

これの代わりにe.targetを使用しませんか? – Aer0

+0

あなたはjsのフィドルを作ることができますか? @stack –

答えて

2
<a onclick="return bootbox.confirm('are you sure?', function(e){ if (e) {window.location.href = $(this).attr('href');} });" href="/Remove-Post/{{ $tb }}/{{$post->id}}" data-toggle="modal" data-target="#confirm-delete"> 

onClickの代わりに、このようなことをすることができます。 window.locationのの代わりに

<a id="some-id" href="/Remove-Post/{{ $tb }}/{{$post->id}}" data-toggle="modal" data-target="#confirm-delete"> 
$('#some-id').click(function(){ 
    var link = $(this).attr('href'); 
    bootbox.confirm('are you sure ?', function(e){ 
     if(e){ 
     window.location.href = link; 
     } 
    }) 
}) 
+0

まだ未定義のページにリダイレクトされます – stack

+0

簡単なフィドルを作成できますか?または私の瞬間を与える私はあなたのためにそれを作成します。 – imrealashu

+0

ok、関数(e、link){からリンクを削除しましたが、今でもうまく動作します。 – stack

-3

this.refは機能の範囲内にありますか? は2年前にJSの私の最後の行を書いた...

編集:私は覚えて 、問題は、戻り値があります。フラッシングでない場合。 hrefの場所に移動します。

があなたのlibaryを持っていないが、あなたはそれを適応させることができます。

<a onclick="if(confirm('are you sure?')) { alert(this.href);};return false;" href="/Remove-Post/{{ $tb }}/{{$post->id}}" data-toggle="modal" data-target="#confirm-delete">Click me</a>

編集2: 愚か投票ダウンする前に、あなたはコードを試してみてください。できます。

-1

使用window.location.assign、それはあなたが望むもののために働くことやwindow.location.hrefが動作します。

0

このコードを使用すると、「はい」をクリックするとポップアップが表示され、さらに処理された場合は同じページに表示されます。 これを試してください。

<a onclick="return confirm('Are you sure you want to delete this?');" href="/Remove-Post/{{ $tb }}/{{$post->id}}" data-toggle="modal" data-target="#confirm-delete"> 
0

Bootboxはサードパーティ製のプラグインです。 bootbox確認コールバック関数内でこのポインタにアクセスすることはできません。 bootboxをコールバックする前にthis.hrefをローカル変数に保存してから、bootbox確認コールバック内のローカル変数を使用しなければなりません。あなたはbootboxコールバック関数内thisオブジェクトにアクセスしているので、あなたの場合は

<a onclick="NavigatePage()" href="/Remove-Post/{{ $tb }}/{{$post->id}}"/> 

function NavigatePage(){ 
    var URL = this.href; 
    bootbox.confirm('are you sure?', function(UserResponse){ 
    if (UserResponse) { 
     window.location = URL 
    } 
    }); 
} 

あなたは未定義取得します。コールバックの中でthisオブジェクトにアクセスすることはできません。

1

this.hrefが原因thisでは動作しませんあなたのコードでは、bootboxオブジェクトに参照のうえされ、この最後はhrefの性質を持っていない:

だけで、共通の機能を使用している私はあなたにお勧めダイアログを表示するのに使用され、同じ方法で複数のURLをURLにリダイレクトすることができます。そしてまた、ここで

がスニペットで、パラメータとして渡すことでdynamiclyダイアログのタイトルを設定します。 (私はリダイレクト防ぐためにconosle.logによってLOCATION.HREFを交換した...)

function redirect(node,message) { 
 
    if(!message) message =""; 
 
    return bootbox.confirm(message, function(e){ if (e) { 
 
    // we use console instead of redirecting directly 
 
    console.log(node.href); 
 
    // location.href = node.href; 
 
    } }); 
 
}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script> 
 
<script src="http://github.com/makeusabrew/bootbox/releases/download/v4.4.0/bootbox.min.js"></script> 
 

 

 

 
<a onclick="redirect(this,'are you sure ?');" href="http://www.google.com" data-toggle="modal" data-target="#confirm-delete">link 1</a> 
 
<br> 
 
<a onclick="redirect(this,'leave the page ?');" href="http://www.bing.com" data-toggle="modal" data-target="#confirm-delete">link 2</a> 
 
<br> 
 
<a onclick="redirect(this,'are you sure to leave !! ?');" href="http://www.yahoo.com" data-toggle="modal" data-target="#confirm-delete">link 1</a>

+0

@stackあなたは最適化されたソリューションのための関数を使うことができます –

関連する問題