Question

我正在写一个有趣的网站，我想根据用户通过表单提交的内容打开不同的页面。应该执行的功能是“ hotelSelection”，但是它不起作用。

自动完成功能正常运行。

感谢您的帮助！

hotelSelection = function() 
{
  var hotelName = document.getElementById("hotelName").value;

    switch (hotelName) {
      case Mare Hotel:  
        window.open("liveItMareHotel.html");
        break;
      case Hotel 2:
        window.open("liveItHotel2.html");
        break;
      case Hotel 3:
        window.open("liveitHotel3.html");
        break;
      case Hotel 4:
        window.open("liveItHotel4.html");
        break;
      case Hotel 5:
        window.open("liveItHotel5.html");
        break;
        default:
        window.open("liveItDefaultList.html");
    }
}

<form id="autoForm" autocomplete="off">
  <div class="autocomplete" style="width:300px;">
    <input id="myInput" type="text" name="hotelName" placeholder="Hotel Name">
  </div>
  <input type="submit" value="Send" onclick="hotelSelection()">
</form>

Answer 1

您这样做的方式是错误的做法。您应该在php文件中进行重定向，然后从表单中调用它。无论如何，使用javascript都可以使用以下代码。

HTML：

function hotelSelection() {
    var hotelName = document.getElementById("hotelName").value;

      switch (hotelName) {
      case 'Mare Hotel':
        window.open("liveItMareHotel.html");
        break;
      case 'Hotel 2':
        window.open("liveItHotel2.html");
        break;
      case 'Hotel 3':
        window.open("liveitHotel3.html");
        break;
      case 'Hotel 4':
        window.open("liveItHotel4.html");
        break;
      case 'Hotel 5':
        window.open("liveItHotel5.html");
        break;
        default:
        window.open("liveItDefaultList.html");

  }
}

Javascript：

{{1}}

Answer 2

这里正在使用jsfiddle。

http://jsfiddle.net/bpvrf45w/

尝试一下

hotelSelection = function() 
{
  var hotelName = document.getElementById("myInput").value;

    switch (hotelName) {
      case 'Mare Hotel':  
        window.open("liveItMareHotel.html");
        break;
      case 'Hotel 2':
        window.open("liveItHotel2.html");
        break;
      case 'Hotel 3':
        window.open("liveitHotel3.html");
        break;
      case 'Hotel 4':
        window.open("liveItHotel4.html");
        break;
      case 'Hotel 5':
        window.open("liveItHotel5.html");
        break;
        default:
        window.open("liveItDefaultList.html");
    }
<form id="autoForm" autocomplete="off">
  <div class="autocomplete" style="width:300px;">
    <input id="myInput" type="text" name="hotelName" placeholder="Hotel Name">
  </div>
  <input type="submit" value="Send" onclick="hotelSelection()">
</form>

<script src="js/hotelSelection.js"></script>

Answer 3

尝试

<form id="autoForm" autocomplete="off">
      <div class="autocomplete" style="width:300px;">
        <input id="myInput" type="text" name="hotelName" placeholder="Hotel Name">
      </div>
      <input type="submit" value="Send" onclick="hotelSelection()">
    </form>

这样的形式

{{1}}

如何从表单调用js脚本？

3 个答案: