链接两个html页面(java脚本)

时间:2018-12-02 17:29:48

标签: javascript html uri

我有两页。一个是index.html,另一个是pk_canonical.html。我想将pk-canonical.html页面与索引页面链接在一起,作为下拉列表中的选项之一。当我尝试运行页面时。两个页面都可以正常运行,但是当我从索引页面的下拉列表中选择选项时,它说:“服务器未找到与请求的URI相匹配的任何内容。”并且它不会进入pk_canonical页面。请帮助我我哪里做错了。下面是代码。

index.html:

<div class="content">
    <!--<p>-->
        <!--<select data-bind="options: Algorithms,-->
                       <!--optionsText: 'algoName',-->
                       <!--value: selectedAlgorithm,-->
                       <!--optionsCaption: 'Choose...'"></select>-->
    <!--</p>-->

    <!--<div data-bind="visible: selectedAlgorithm"> &lt;!&ndash; Appears when you select something &ndash;&gt;-->
        <!--You have chosen a country with population-->
        <!--<span data-bind="text: selectedAlgorithm ? selectedAlgorithm.algoPage : 'unknown'"></span>.-->
    <!--</div>-->
    <select id="algoSelect" onchange="algoSel(this)">
        <option selected="selected" disabled="disabled">Select an algorithm</option>
        <option value="Nussinov.html">Nussinov - max. #bp structure</option>
        <option value="counting.html">Structure Counting</option>
        <option value="McCaskill.html">McCaskill - structure probabilities</option>
        <option value="MEA.html">MEA structure</option>
        <option value="co-folding.html">Co-folding interactions</option>
        <option value="hybrid-only.html">hybrid-only interactions</option>
        <option value="accessibility.html">accessibility-based interactions</option>
        <option value="pk_canonical.html">canonical pseudoknot</option>


    </select>

    <div id="algopage">

    </div>

    <script type="application/javascript">
        function loadPage(){
            console.log("algo selected:", document.location);
            var $_GET = {};

            document.location.search.replace(/\??(?:([^=]+)=([^&]*)&?)/g, function () {
                function decode(s) {
                    return decodeURIComponent(s.split("+").join(" "));
                }

                $_GET[decode(arguments[1])] = decode(arguments[2]);
            });

//            console.log($_GET['id']);
            $(algopage).load($_GET['id']);
//            console.log("algo loaded");

        };

        function algoSel(algo){
            window.location='index.html?id=' + algo.value;

        };

    </script>

</div>


</body>

pk_canonical.html:

 <div class="row" id="introduction">
   <div class="colW600">
     The algorithm by
     <a href="https://doi.org/10.1093/nar/gkm258">Reeder&Giegerich</a>
     briefly sketch the way to implement  an extension of the usual dynamic programming (DP) scheme for RNA folding [5,6].
     <br />
     Helical stem called 'Canonical stem' which comprises only canonical Watson-Crick base pairs and usually ends with two canonical C=G base pairs before the internal loop.
     C(i,j) =  Maximal length of canonical stem with outermost base pairs (i,j)

     <br />
     A canonical pseudoknot consists of two crossing canonical stems.
     <br />
     The (suboptimal) backtrace procedure the pseudoknot matrix is handled at the end.
     <br />
     <br />
     Here, Since only two helices participate in one pseudoknot, we loop over all possible knots in one O(n4) loop and store the result in a two-dimensional matrix. 
     Finally, the traceback is visualized. 
   </div>
   <div class="colW150">
    <img alt="Canonical pseudoknot" src="output-onlinejpgtools.png" width=120 height=90 >
  </div>
 </div>

1 个答案:

答案 0 :(得分:1)

以此替换您的功能,

 function algoSel(algo){
     window.location= algo.value;
 };

您好,所以小问题出在您的algoSel(algo)函数上,只需将值algo.value分配给window.location即可使其重定向到您的pk_canonical算法页面。谢谢。

在这里

    function algoSel(algo){
        window.location='index.html?id=' + algo.value;
    }

,您告诉js重定向到index.html页面,并查找名为pk_canonical.html的资源/路径,而不是告诉它仅重定向到pk_canonical.html