我有一个div就像一个按钮(.butt),当我点击它时,它应该阻止一个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) {
d.stopPropagation();
var x = $(d.target);
x.html('<input id="edit2" style="width: 40px;" value="'+x.text()+'">');
var this_id = x.context.id;
$("#edit2").on('blur', function(d) {
if (h < 1) {
h = h+1;
d.stopPropagation();
$(d.target.parentElement).text(d.target.value);
$.get(url, {id: this_id, value: d.target.value})
.done(function(d){ if(d == undefined || d != 1) { alert('Something went wrong, check your data and results. '+d);}})
.fail(function(d){ alert('error');});
$("#edit2").off('blur');
}
});
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>
答案 0 :(得分:2)
您可以使用preventDefault
event.preventDefault()方法停止an的默认操作 发生的因素。
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();
d.stopPropagation();
var x = $(d.target);
x.html('<input id="edit2" style="width: 40px;" value="'+x.text()+'">');
var this_id = x.context.id;
$("#edit2").on('blur', function(d) {
if (h < 1) {
h = h+1;
d.stopPropagation();
$(d.target.parentElement).text(d.target.value);
$.get(url, {id: this_id, value: d.target.value})
.done(function(d){ if(d == undefined || d != 1) { alert('Something went wrong, check your data and results. '+d);}})
.fail(function(d){ alert('error');});
$("#edit2").off('blur');
}
});
h = 0;
});
});
&#13;
.butt{width:15px;height:15px; background-color:red;border-radius: 50%;}
&#13;
<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>
&#13;