html 我们如何设置表单和输入标记上的属性来让“我感觉幸运”搜索工作(没有javascript)？

hfyxw5xn 于 2023-05-27 发布在 Java

关注(0)|答案(2)|浏览(149)

对于Edx.org CS50's Web Programming with Python and JavaScript的项目0，其中一项任务是创建一个搜索功能，允许用户执行高级Google搜索和“I'm feeling lucky”提交按钮。
在进入更具挑战性的Google高级搜索之前，“I'm feeling lucky”提交应该发送一个httpget请求URL，该URL只返回搜索结果的第一个项目。谷歌已经停止了这个功能，讲座并没有涉及这一点，但从研究我有gathered我发现，下面的URL，当键入到谷歌浏览器的地址栏确实完成了任务。
http://www.google.com/search?q={query}&btnI
或https://www.google.com/search?btnI=1&q={query}
我不熟悉如何设置获取请求URL上面只使用HTML表单和输入标签。在相关的讲座中没有任何内容涉及到这一点，脚本也没有介绍。我已经尝试了各种方法来设置Form和Input标签的属性，但是当应用时，结果只是对q={query}的常规Google搜索。下面是我尝试过的一个例子。

<form action="https://www.google.com/search?btnI=1&q">

    <input type="text" class="search" name="q" style="width:300px"/>
    <input type="submit" class="input_rel_lucky" value="I'm Feeling Lucky" />

</form>

结果只是一个普通的谷歌搜索。我已经尝试了'type = url'，并在表单上键入了与地址栏上工作的URL完全相同的URL。我可能错过了一些简单的东西，但我已经花了太多的时间已经试图让它工作。
我们如何设置表单和输入标记上的属性，以使“我感到幸运”搜索工作？

Html

来源：https://stackoverflow.com/questions/62949860/how-do-we-set-up-the-attributes-on-the-form-and-input-tags-to-get-the-im-feeli

2条答案

按热度按时间

mpgws1up1#

换成这个

<form action="https://www.google.com/search">

    <input type="text" class="search" name="q" style="width:300px"/>
    <input type="submit" class="input_rel_lucky" name="btnI" value="I'm Feeling Lucky" />
    
    </form>

赞(0）回复(0）举报 2023-05-27

zwghvu4y2#

感谢fabio-assuncao并添加更多：对于google服务器的GET方法，重要的是提交元素的名称和输入的文本值。对于谷歌搜索按钮默认谷歌名称是btnK和我感觉幸运的是btnI。此外，很高兴知道迫使谷歌将搜索结果重定向为“我感觉幸运”选项到第一个结果，就足以将其提交名称命名为btnI，正如之前所说的那样。为了防止空的Google搜索提交导致https://www.google.com/wbhp，我写了下面的JS来执行它，它工作了。要添加更多关于进入google图片结果的信息，在google图片搜索页面中，你应该添加一个隐藏的input元素，它的名字是tbm，值是isch。

<script>
        function submitForm(event) {
          var searchBox = document.getElementById('search-box');
          var inputValue = event.submitter.value;
          if (inputValue === 'Google Search' && searchBox.value.trim() === '') {
              event.preventDefault(); // Prevent form empty search submission
            }
        }
      </script>

<!DOCTYPE html>
    <html>
    <head>
      <title>Search</title>
      <link rel="stylesheet" type="text/css" href="styles.css">
    </head>
    <body>
      <div>
        <span>
            <a href="templates/image_search.html">Google Image Search</a>
            <a href="templates/advanced_search.html">Google Advanced Search</a>
        </span>
      </div>
      <div id="search-container" name="searchdiv">
        <form action="https://www.google.com/search" name="searchform" method="GET" onsubmit="submitForm(event)">  
          <input type="text" id="search-box" name="q">
          <br>
          <div>
            <input type="submit" id="search-sub" name="btnK" value="Google Search">
            <input type="submit" class="input_rel_lucky" name="btnI" value="I'm Feeling Lucky"/>
          </div>
        </form>
      </div>
    </body>
    </html>

<script>
    function submitForm(event) {
      var searchBox = document.getElementById('search-box');
      if (searchBox.value.trim() === '') {
          event.preventDefault(); // Prevent form empty search submission
        }
    }
  </script>

<!DOCTYPE html>
<html>
<head>
  <title>Images Search</title>
  <link rel="stylesheet" type="text/css" href="../styles.css">
  </head>
<body>
  <div>
    <span>
        <a href="../index.html">Google Search</a>
    </span>
  </div>
  <div id="search-container" name="searchdiv">
    <form action="https://www.google.com/search" name="searchform" method="GET" onsubmit="submitForm(event)">  
      <input type="text" id="search-box" name="q">
      <br>
      <div>
        <input type="submit" id="search-sub" value="Google Image Search">
        <input type="hidden" name="tbm" value="isch">
      </div>
    </form>
  </div>
</body>
</html>

赞(0）回复(0）举报 2023-05-27

我来回答

html 我们如何设置表单和输入标记上的属性来让“我感觉幸运”搜索工作(没有javascript)？

2条答案

相关问题

热门标签

最新问答