href redirect onclickを防ぐにはどうすればいいですか？

Question

ボタンをクリックすると、hrefがリダイレクトして入力を開かないようにする必要があります。それは仕事量ですが、それはまだリダイレクトされ、リダイレクトから戻ると入力が表示されますが、入力を押すとまだリダイレクトされます。

divを押すとリダイレクトが無効になり、値を変更するために入力に値を挿入できるようにするにはどうすればよいですか？

var x; 
 
var h = 0; // blur fires multiple times, use h to count and fire once 
 
var url = 'up.php'; 
 

 
$(".butt").on('click', function(event) { 
 
event.preventDefault(); 
 
$(".tk").on('click', function(d) { 
 
\t d.stopPropagation(); 
 
\t var x = $(d.target); 
 
\t x.html('<input id="edit2" style="width: 40px;" value="'+x.text()+'">'); 
 
\t var this_id = x.context.id; 
 
\t 
 
\t $("#edit2").on('blur', function(d) { 
 
\t \t if (h < 1) { 
 
\t \t \t h = h+1; 
 
\t \t \t d.stopPropagation(); 
 
\t \t \t 
 
\t \t \t $(d.target.parentElement).text(d.target.value); 
 
\t \t \t 
 
\t \t \t $.get(url, {id: this_id, value: d.target.value}) 
 
\t \t \t \t .done(function(d){ if(d == undefined || d != 1) { alert('Something went wrong, check your data and results. '+d);}}) 
 
\t \t \t \t .fail(function(d){ alert('error');}); 
 
\t \t \t $("#edit2").off('blur'); 
 
\t \t } 
 
\t \t 
 
\t \t 
 
\t }); \t 
 
\t h = 0; 
 
}); 
 
});

.butt{width:15px;height:15px; background-color:red;border-radius: 50%;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="butt"> </div> 
 
<a href="http://www.google.com" class="tk">click</a>

Answer 1

あなたはpreventDefault

event.preventDefault（）メソッドが起こってから 要素のデフォルトの動作を停止することができます。

d.preventDefault(); 

var x; 
 
var h = 0; // blur fires multiple times, use h to count and fire once 
 
var url = 'up.php'; 
 

 
$(".butt").on('click', function(d) { 
 
$(this).on("click", function(){return false;}) 
 
$(".tk").on('click', function(d) { 
 
    d.preventDefault(); 
 
\t d.stopPropagation(); 
 
\t var x = $(d.target); 
 
\t x.html('<input id="edit2" style="width: 40px;" value="'+x.text()+'">'); 
 
\t var this_id = x.context.id; 
 
\t 
 
\t $("#edit2").on('blur', function(d) { 
 
\t \t if (h < 1) { 
 
\t \t \t h = h+1; 
 
\t \t \t d.stopPropagation(); 
 
\t \t \t 
 
\t \t \t $(d.target.parentElement).text(d.target.value); 
 
\t \t \t 
 
\t \t \t $.get(url, {id: this_id, value: d.target.value}) 
 
\t \t \t \t .done(function(d){ if(d == undefined || d != 1) { alert('Something went wrong, check your data and results. '+d);}}) 
 
\t \t \t \t .fail(function(d){ alert('error');}); 
 
\t \t \t $("#edit2").off('blur'); 
 
\t \t } 
 
\t \t 
 
\t \t 
 
\t }); \t 
 
\t h = 0; 
 
}); 
 
});

.butt{width:15px;height:15px; background-color:red;border-radius: 50%;}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="butt"> </div> 
 
<a href="http://www.google.com" class="tk">click</a>