Question

单击按钮时尝试重定向到另一个html文档。这是我的js代码：

$('#getTextBoxValue').on("click", function(){
var value = $("#textbox1").val();
});

$('#getTextBoxValue').click(function() {
    window.location.href = 'view.html';
    return false;
});

这是我的HTML代码：

<form class="col-lg-12">
            <div class="input-group" style="width:500px;text-align:center;margin:0 auto;">
            <input class="form-control input-lg" placeholder="Enter single quote-surrounded link" type="textbox" id="textbox1"></input>
              <span class="input-group-btn"><button class="btn btn-lg btn-primary" type="submit" id= "getTextBoxValue">Submit</button></span>
            </div>
          </form>
    <script src="js/script.js"></script>
    <script src="js/viewer.js"></script>

当我点击按钮时没有任何反应，有没有更好的方法呢？

Answer 1

另一种doesn't need jQuery, only vanilla javascript：

    <script type="text/javascript>
        function goToPage() {
            document.location = 'view.html';
        }
        Button.addEventListener('click', goToPage);
    </script>
    …
    <button id="Button">Go</button>

您创建了button元素，并为其提供了唯一的id属性（可以是任何元素）。
然后您向其添加点击 EventListener，执行指定的功能 goToPage。
goToPage功能会更改文档location以导航到该文档。

一个doesn't even need javascript：

    <form action="view.html">
        <input type="submit" value="Go"/>
    </form>

您只需创建input类型的submit元素。
然后，您只需将其放入form元素，并将文档的网址设为action。

第一种方法的优点是你可以使几乎你想要点击的任何元素，只有少数例外。第二个优点是你只使用纯HTML。

Answer 2

试试这个html：

<input type='button' id='unique_identifier'>

这个小javascript片段（使用jQuery）：

// similar behavior as an HTTP redirect
$('#unique_identifier').on('click', function () {
  window.location.replace('view.html');
});

// similar behavior as clicking on a link
$('#unique_identifier').on('click', function () {
  window.location.href = 'view.html';
});

Thanks to Ryan McGeary

Answer 3

您不需要任何javascript来执行此操作，只需按照以下方式设置您的表单操作：

<form class="col-lg-12" action="view.html">
            <div class="input-group" style="width:500px;text-align:center;margin:0 auto;">
            <input class="form-control input-lg" placeholder="Enter single quote-surrounded link" type="textbox" id="textbox1"></input>
              <span class="input-group-btn"><button class="btn btn-lg btn-primary" type="submit" id= "getTextBoxValue">Submit</button></span>
            </div>
          </form>
<script src="js/script.js"><\script>
<script src="js/viewer.js"><\script>
</form>

单击按钮时链接到另一个html文档

3 个答案: