javascript - 通过 JQuery Onclick 将值传递到函数中

Question

目标

我正在尝试创建一个表单，让用户选择一个项目，然后在用户选择一个项目后显示该项目的详细信息。但是，在这样做之前，我尝试通过创建一个简单的测试页面来测试是否可以，该测试页面用简单的警报替换要显示的项目详细信息

代码(JQuery):

<!--Function to display item details upon selection-->

<script type="text/javascript">
function LoadDetails(cat,subcat,item)
{
    return function(){
    alert("Values are passed through successfully.Category is"+cat+", subcategory is"+subcat+"and item is"+item);
    }
}
</script>

<script type="text/javascript">
$(document).ready(function(){
    $("#itemsubcat").hide();
    $("#item").hide();
    $("#submititem").hide();
    $("#itemcat").load("getcategory.php");

    $("#itemcat").change(function(){
        var cat=$("#itemcat").val();
        $("#itemsubcat").show();
        $("#itemsubcat").load('getsubcategory.php?cat='+cat);
    });

    $("#itemsubcat").change(function(){
        var cat=$("#itemcat").val();
        var subcat=$("#itemsubcat").val();
        $("#item").show();
        $("#item").load('getitem.php?cat='+cat+'&subcat='+subcat);
    });

    $("#item").change(function(){
        $("#submititem").show();
    });
        var cat=$("#itemcat").val();,
        var subcat=$("#itemsubcat").val();,
        var item=$("#item").val();,
    $("#submititem").bind('click',{param:cat,subcat,item},LoadDetails);
    });
});
</script>

代码(Html):

 <table>
    <tr>
        <td><select id="itemcat" /></td>
        <td><select id="itemsubcat" /></td>
        <td><select id="item" /></td>
        <td><input type="button" id="submititem" name="submititem" value="Get Item" /></td>
    </tr>
    </table>

问题

当我单击“submititem”时，警报成功弹出，但值 cat、subcat 和 item 显示为未定义，而不是应该传递的值。我如何将数据/值传递到函数加载详细信息？

尝试的解决方案:

我尝试过使用.bind()，但没有成功。

例如

var cat=$("#itemcat").val();,
var subcat=$("#itemsubcat").val();,
var item=$("#item").val();,
$("#submititem").bind('click',{param:cat,subcat,item},LoadDetails);

问题:

是否可以使用函数 LoadDetails 从我的数据库(通过 PHP)检索项目详细信息，然后将其输出？

Answer 1

要将值传递给具有事件的函数，语法为:

$("#submititem").bind('click', LoadDetails(cat, subcat, item));

jsFiddle例如。

对于您的问题，您的代码似乎只是客户端，但如果您想从服务器加载数据，我建议您阅读此learn jQuery ajax