无法通过jquery更改表单操作

Question

我将尝试使用jQuery在提交时更改表单操作链接。请查看以下代码：

javascript

$(document).ready(function(){
    $("form[name='search']").submit(function(e){
        var submit=$(this);
        submit.attr('action','?search='+submit.find("input[name='tsearch']").val());
    });
});

HTML/PHP

    <form name="search" method="post">
          <input class="inputbox" type="text" name="tsearch" value="<?php echo $text_search; ?>" />

虽然我似乎无法让它正常工作。这里的任何帮助都将不胜感激。

- Lawrence

---

我相信那是一个无限循环！ - Alexander

是的，亚历山大。那是一个无限循环。e.preventDefault() 是不必要的。只需添加动作即可。 - Lawrence

Answer 1

以下是一个可行的示例：http://jsfiddle.net/RmKDT/4/

您可以通过警报看到操作正在更改。您只需要重新提交表单即可。

编辑：修复了潜在的无限循环问题。

$(function(){

  var submitted = false;
  $('form').submit(function(e){

    if (submitted == true) {

      return;

    }
    e.preventDefault();
    var action = $(this).attr('action');

    alert(action);

    $(this).attr('action', 'two.php');
    action = $(this).attr('action');

    alert(action);

    submitted = true;
    // resubmit the form
    $(this).submit();

  });

});

- mynewaccount

---

@Alexander - 修复了无限循环问题。 - mynewaccount

Answer 2

您的代码似乎没问题。有几个方法可以尝试让它正常工作。

1. 确保您的脚本被引入到页面中，一种检查方法是使用Chrome调试器中的“资源”选项卡，并在html头部分搜索文件是否存在。

2. 确保在引入jQuery之后再引入datatale脚本，因为它肯定依赖于jQuery。

3. 检查jQuery是否正确引入且只引入一次。

4. 注意jQuery冲突。可能有其他库覆盖了$，所以您的代码无法工作，因为$不再是jQuery的别名。您可以使用jQuery.noConflict()来避免与页面上使用相同变量$的其他库发生冲突。

5. alert('?search='+submit.find("input[name='tsearch']").val())查看是否获取到了您想要的值。

- Techie

---

嗨，Dasun，感谢你的肯定。 - Lawrence