Javascript 用于表单提交的通用jquery函数

我有一个用PHP/JavaScript开发的小标签系统

对于FormSubmissioni，我将JQuery函数绑定到“submit”事件，该事件向服务器发送Ajax查询，避免重新加载页面（并丢失其他选项卡）。我已经为每个表单编写了一个函数，但意识到它们是相同的（接受输入、发送Ajax查询、显示返回消息），所以我决定使用定义每个表单的参数创建一个通用jquery函数）

我有这个功能：

function submit_search(entity){
        $('#'+entity.name+'_searchform').submit(function(){
            var url = public_path+entity.name+'/search';
            var key = $('#'+entity.name+'_search_key').val();

            $.ajax({
                type: 'POST',
                url: url,
                data: {search_key: key},
                success: entity.submit_search(result)
            }); 

            return false;
    });
}

其中，

entity

是一个JS对象，它具有实体的名称和我要执行的success函数。此函数是在加载主页面时加载一次的脚本中编写的。加载选项卡时，我只需使用实际实体调用

submit\u search（）

这在我看来是合乎逻辑的。但它不起作用。问题是，举例来说，jquery无法识别

var key=$（'#'+entity.name+'_search_key'）.val（）之后的元素，密钥为空

我做错了什么？
这样的事情不应该奏效吗

$(document).ready(function() {
    $('#search_form').live("submit", function(event) {
        event.preventDefault();
        // do some magic
    });
});

您不需要将一些手动函数与jquery代码混合使用。
您的成功函数将在请求之前执行

  $.ajax({
            type: 'POST',
            url: url,
            data: {search_key: key},
            success: *entity.submit_search(result)*
        })

我想submit_search不会返回指向函数的指针，所以
您需要传递指针以提交搜索

  $.ajax({
            type: 'POST',
            url: url,
            data: {search_key: key},
            success: *entity.submit_search*
        })

关于重新计算元素，请确保编写了正确的选择器。尝试在浏览器的调试/监视工具中硬编码预期的体验，并检查它是否正常，如

$('#EntityNameValue_search_key').length > 0

如果您真的想以可重用的方式抽象所有这些内容，您可以使用以下内容：

$(function() {
    $("body").on("submit", "form.ajax", function(event) {
        event.preventDefault();
        var $target = $(event.target);
        var successFunk = $target.attr("data-success") || "success";
        var url = $target.attr("action");
        $.post(url, $target.serializeObject(), {
            success: function(data) {
                window[successFunk](data);
            }
        });
    });
});

序列化对象在以下位置可用：

然后您只需创建一个表单，如：

<form class="ajax" action="url_i_want_to_post_to" data-success="successCallabck">
  <input type="text" name="search_key"/>
</form>



它将把一个JSON对象
{search\u key:${value\u of_search\u key}}
发布到表单的目标，并调用函数
successCallback
或返回时指定的任何函数。理想情况下，您希望更好地确定回调的范围，而不是锁定到
窗口。您可以使用注册表，但如果使用名为FORM#CALLBACKS之类的对象，则可以保持组织有序。
您写得正确：
$（'#'+entity.name+''u search_key'）.val（）。您确定
entity.name
包含您期望的正确值吗？是@swatkins，它具有正确的值，刚刚打印了一个警报（entity.name），并且是OK。您还确定它指向类似文本输入的内容（具有
val（）
）具有与您要查找的内容匹配的
id
，而不仅仅是
name
。传递给“实体”的值是什么？是否确实存在“#”+实体名称“+”搜索键“？您可以在chrome或ie（F12）上使用开发人员工具，并在此函数上添加换行符，然后查看传入的内容。然后检查$（'#'+entity.name+''u search_key'）.length是否大于1（意味着它确实存在）。您在哪里检查
key
是否返回了错误的结果？您是否在分配后立即中断或登录？谢谢回答。我不确定你的建议。我的表单名是entity.name+“\u searchform”，举例来说：city\u searchform、country\u searchformsubmit\u search是一个函数。但还没有到关键点去检查它是否有效。我的问题是我无法访问$（“#entityname_search_key”）我不知道为什么：（你能提供一个表单及其内容的示例吗？特别是你想访问的输入。请注意，当你在submit event hadler中时，这个关键字就是表单-try
$（this）。find（'input'））
或类似的内容您关于提交搜索功能的看法是正确的。必须传递指针。出现了问题，我以前以为是行。非常感谢