2

我是 html 新手，但我需要使这段代码功能正常：

    <form method="get" action="http://cat.opal-libraries.org/search~S9/X">
     <p>
     <select name="searchtype">
    <option value="X" selected="selected">Keyword</option>
    <option value="t">Title</option>
    <option value="a">Author</option>
    <option value="d">Subject</option>
    </select>
    <input class="textfield" name=" " style="width: 200px;" type="text">
    <input class="button" value="Search" type="submit">

我希望能够选择说一个标题，然后输入一个标题，然后点击搜索，让它像我在这个页面中输入它一样工作 http://cat.opal-libraries.org/search/t 我将不胜感激关于这样做的任何建议！

4

3 回答 3

3

很抱歉没有回答，但正如我所提到的，您的问题的答案太长了，不适合 Stack Overflow。

我建议您通过遵循这样的 PHP 教程来弄脏您的手。

附带说明一下，您的 HTML 无效。您在第 1 行和第 2 行打开<form>并<p>标记，并没有关闭它们。从语义上讲，将这些表单元素放在一个段落中有点奇怪。这不是一个段落的真正作用。

于 2013-01-23T00:07:36.407 回答
2

问题非常广泛，因为有很多方法可以解决它。如果您想按标题搜索，下面是您的代码的简单编辑，它可以工作：

<form method="get" action="http://cat.opal-libraries.org/search/t">   
  <input class="textfield" name="SEARCH" style="width: 200px;" type="text">
  <input class="button" value="Search" type="submit">
</form>

我所做的是修复您的 URL 并为输入命名。您可能想了解<form method="get"工作原理，然后您可能会弄清楚如何按不同的字段进行搜索。

更新以包含完整代码。如果您阅读这些项目以了解其工作方式/原因，那就太好了。基本上，当他们选择新的搜索类型时，您需要更改表单的操作（即您丢失的部分）。我还添加了“searchscope”字段并将其设置为 28，因为他们的网站正在这样做。我不知道那是做什么的。

这假设您正在引用 jQuery。相关文档jQuery attr()和jQuery change()。

<form id="searchForm" method="get" action="http://cat.opal-libraries.org/search/X">  
    <select id="searchType">
    <option value="X" selected="selected">Keyword</option>
    <option value="t">Title</option>
    <option value="a">Author</option>
    <option value="d">Subject</option>
    </select>
  <input class="textfield" name="SEARCH" style="width: 200px;" type="text">
  <input name="searchscope" type="hidden" value="28">
  <input class="button" value="Search" type="submit">
</form>

<script>
    $("#searchType").change(function () {
        var newPath ="http://cat.opal-libraries.org/search/" + $("#searchType").val();
        $("#searchForm").attr("action", newPath);
    });
</script>
于 2013-01-23T00:09:35.190 回答
0

看起来您引用的搜索引擎为每个“搜索类型”使用了一个单独的端点，这实际上使得使用 Javascript 和对您的表单进行一些更改相对容易。

  1. name将上的属性更改<select>为 an id，以便它实际上不会发送到搜索引擎。
  2. 将文本字段的属性更改name为“SEARCH”，以便将其发送并识别为搜索字符串。

  3. 向 sel 添加一个 on-change 监听器，它会根据需要修改表单的 action 属性。如果您使用的是 JQuery，那可能看起来像这样：

    var base = "http://cat.opal-libraries.org/search/";
$("#searchtype").change(function() {
  $(that).closest("form").attr("action", base + $(that).val());
});
于 2013-01-23T00:43:21.170 回答