gpt4 book ai didi

javascript - 阻止 onclick jquery 函数以允许 onclick ajax 提交

转载 作者:行者123 更新时间:2023-11-27 22:34:33 24 4
gpt4 key购买 nike

<div class="alert alert-success" id="1">   
<form style="height:42px;" lpformnum="1">
<h4 class="pull-left" style="text-transform: capitalize; width:11%;">
Title:
</h4>
<textarea class="pull-left" style="margin-right:1%;">
This is a msg
</textarea>
<h4 class="pull-left" style="text-transform: capitalize; width:6%;">
Title 2:
</h4>
<input class="pull-left" style="width:8%; margin-right:1%; " type="text"
id="myid" value=""
/>
<button class="pull-left btn btn-primary" id="update" value="1" type="submit"
style="width:7%; margin-right:1%;" name="credits">Submit</button>
<button class="pull-left btn btn-danger" type="submit" id="delete" style="width:6%"
value="" name="credits">Delete</button>
</form>
</div>


<script>
$(".alert").click(function(){
$(this).fadeOut(300, function(){
var checkValues = $(this).attr('id');
var checkPost = $(this).children("textarea").text();
var checkType = $(this).children("span").attr('class');
var checkName = $(this).children("span").attr('class');
$.ajax({
url: '/se/test.php',
type: 'post',
data: {id:checkValues, posti:checkPost, types:checkType, name:checkName},
success:function(data){
$(this).remove(); // location.reload();
}
});
});
});
</script>

上面的代码效果很好,但我需要允许 div.alert 内的按钮在单击时通过 ajax 提交表单。

<script>
$('button[id=update]').click(function(){
e.preventDefault();
var checkValues = $(this).children("#update").val();
var checkCred = $(this).children("#ucredits").val();
var checkPost = $(this).children("textarea").text();
var checkType = $(this).children("i").text();
$.ajax({
type: "POST",
url: "update_social_cred.php",
data: { id: checkValues, credits: checkCred, text: checkPost, type: checkType },
success:function(result) {
}
});
});
</script>

但是我尝试了很多不同的方法,要么按钮不提交表单,要么尝试通过标准提交而不是通过 ajax 提交表单。

如何阻止 .alert click 功能,从而允许按钮通过 ajax 提交表单?

最佳答案

$('.alert.alert-success').on('click', 'button[id=update]', function(e) {
e.preventDefault();
e.stopPropagation();
var checkValues = $(this).children("#update").val();
var checkCred = $(this).children("#ucredits").val();
var checkPost = $(this).children("textarea").text();
var checkType = $(this).children("i").text();
$.ajax({
type: "POST",
url: "update_social_cred.php",
data: { id: checkValues, credits: checkCred, text: checkPost, type: checkType },
success:function(result) {
}
});
});

区别在于点击处理程序...

$('.alert.alert-success').on('click', 'button[id=update]', function(e) {

定位动态元素.alert.alert-success,然后绑定(bind)一个事件.on('click',然后是事件绑定(bind)到的项目 - button[id-update]。然后将事件本身传递给函数 - function(e)

这将针对按钮单击,并且您的 e.preventDefault(); 将真正起作用。 e.preventDefault 中的 e 是事件。您没有通过函数传递它,因此提交按钮正在执行提交按钮的操作。

关于javascript - 阻止 onclick jquery 函数以允许 onclick ajax 提交,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39244957/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com