Php 使用图像作为提交按钮提交表单-无刷新

目前，我有一个表单，其中有一个提交图像。它可以很好地工作，因为在表单中，变量被传递和处理。但是，每次单击表单的“提交”时，页面都会刷新，因为处理页面有返回表单页面的标题

我需要一种不用刷新就发送表单变量的方法。我知道这可以通过ajax实现。然而，我面临一个问题，因为我的提交按钮是一个图像。任何关于如何更正代码以提交表单而无需刷新的帮助都将非常有用

    <form name ="nominate" action="" id ="nominate"  method="POST">
        <input type="hidden" name="id" value="<?php echo $id;?>">
        <input type="hidden" name="screenName" value="<?php echo $author;?>">
        <input type="hidden" name="course" value="<?php echo $course;?>">

//this is the image submit button 


 <input type="image"  style="float: left;" onMouseOver="this.src='images/nominated.png'"
            onMouseOut="this.src='images/nominate.png'" value="Place Order" src="images/nominate.png"  width="60" height="20">

</form>

<script> 
  $(function() {
    $(".button").click(function() {
     var id = $("#id").val();  
    var screenName = $("#screenName").val();


    var dataString = 'id='+ id + '&screenName=' + screenName + '&course=' + course;  
    alert (dataString);
    $.ajax({
       type: "POST",
       url: "nominate.php",
       data: dataString,
       success: function(){
         alert(dataString);
       }
    });


    });
  });

</script>

如果将“button”类添加到图像中，那么您所完成的代码应该可以工作

<input type="image" class="button"....

将类“按钮”添加到图像中

此外，您似乎没有在任何地方定义
课程
。您可能也想解决这个问题。
首先，您需要添加
id
属性，因为jquery
$（“#”）中的
是元素的id

<input type="hidden" name="id" id="id" value="<?php echo $id;?>">
<input type="hidden" name="screenName" id="screenName" value="<?php echo $author;?>">
<input type="hidden" name="course" id="course" value="<?php echo $course;?>">

这将提醒您从“namite.php”返回的任何内容。确保从脚本中删除
标题（）
，并尽可能返回成功或错误消息。
OMG！！我不敢相信我忘记调用php课程变量了。我在顶部声明了它，但没有将其指定为javascript变量。但是，警报现在显示id和课程没有通过。您是否确认您的隐藏表单字段正在由PHP填充
$id
和
$author
可能不包含任何数据。我为每个字段输入了id，但测试后发现传递的id始终是列表中的第一个id。我不知道为什么会这样。我是否也需要将ajax放入循环中？
$(".button").click(function(){
var url = "nominate.php";
var id = $("#id").val();  
var screenName = $("#screenName").val();
var course = $("#course").val();

$.post(url,{id:id, screenName:screenName , course:course }, function(data){

alert(data);

    });

});