带有表单的自定义 URL答案

【问题标题】：Custom URL with form带有表单的自定义 URL
【发布时间】：2012-03-12 06:11:57
【问题描述】：

我正在使用 codeigniter，并且有一个搜索栏，我想将其映射到控制器中的搜索类。当前的 URL 是search/searchterm。我想构建一个遵循这一点的表单，并且基本上只是获取表单中的任何内容并将其传递给 URL。我试过像这样在提交时进行 javascript 重定位：

document.location.href= "<?= base_url() ?>" + document.forms["searchbox"]["search"].value

但它似乎不起作用。对于这种情况，你们推荐什么最好的？我敢肯定，很多人在他们的项目中都需要类似于我想要的东西。

【问题讨论】：

标签： javascript codeigniter url redirect uri

【解决方案1】：

如果它不在表单内，这将起作用，要在表单内执行此操作，您需要设置 onsubmit 事件来为表单设置适当的操作。

这是一个简单的工作示例：

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script type="text/javascript">
        function foo() {
            document.forms["searchbox"].action= window.location.href+"/" + document.forms["searchbox"]["search"].value; 
            return true; 
        }
    </script>
</head>
<body>
    <form  id="searchbox" onsubmit="foo()" > 
        <input type="text" id="search" />
        <input type="submit" />
    </form>
</body>
</html>

【讨论】：

【解决方案2】：

这是另一个示例。它是一个有效的 xhtml 文档，无论您在搜索框中键入什么内容，它都会在 google 中进行搜索。它适用于 FF10、IE8、Chrome 17 和 Opera 11.61。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Search</title>
    <script type="text/javascript">
        window.onload = function(){
            var form = document.getElementById("form1");
            form.onsubmit = function(){
                var searchText = document.getElementById("searchText");
                window.location = "http://www.google.com/search?q=" + searchText.value;
                return false;
            };          
        };
    </script>
</head>
<body>
    <form id="form1" method="post" action="">
        <div>
            <label for="searchText">Search:</label>
            <input type="text" id="searchText" name="searchText" />
            <input type="submit" value="Click" />
        </div>
    </form>
</body>
</html>

【讨论】：