页面的链接是:localhost / mysite / create-user
这是代码:
<form class="form-horizontal" name = "signUp1F" id = "signUp1F">
<input class="input-xlarge focused" name="pskil" id ="pskil" type="text" placeholder = "Doctor, Trainer, Human Resource etc.">
<input type="hidden" name="neoid" id="neoid" value="<?php echo $neoid; ?>" />
<span><button id = "plus" class="btn btn-success">Plus</button></span>
<div id="skillsAdded"></div>
</form>
jquery代码:
<script type="text/javascript">
$('#plus').click( function(event){
var pskil = $('#pskil').val();
var neoid = $('#neoid').val();
if( !pskil){
alert( "Please write a skill.");
return false;
}
$.ajax({
type: 'post',
url: "localhost/mysite/add-skill",
data: { pskil: pskil, neoid: neoid},
success: function( response){
$('#skillsAdded').append( pskil + "<br>");
return false;
}
});
});
</script>
目的是:用户输入技能值到输入,单击加号按钮,发送ajax请求以将技能添加到数据库。处理此请求的代码位于localhost / mysite / add-skill。
但事情出了问题。当我点击“加号”按钮时,它会转到页面localhost / mysite / create-user?pskil = php&amp; neoid = 53。什么可以使这个方向?我已经在这个问题上工作了近2个小时,我无法处理它。
答案 0 :(得分:1)
问题是您的按钮标记提交了您的表单。这是您可以使用的更新的JavaScript源代码。 jQuery为事件提供了内置的preventDefault()方法。这将是一个例子,阻止按钮提交表单。
<script type="text/javascript">
$('#plus').click( function(event){
event.preventDefault();
var pskil = $('#pskil').val();
var neoid = $('#neoid').val();
if( !pskil){
alert( "Please write a skill.");
return false;
}
$.ajax({
type: 'post',
url: "localhost/mysite/add-skill",
data: { pskil: pskil, neoid: neoid},
success: function( response){
$('#skillsAdded').append( pskil + "<br>");
return false;
}
});
});
</script>