javascript - 在 DSpace 4.2 Mirage 主题中使用 javascript cookie 在文本框中保留搜索字符串

Question

我已将 DSpace 搜索框修改为如下内容：

用户在搜索框中输入搜索字符串，然后按回车键以获取搜索结果。这会刷新页面，因此用户最初输入的搜索字符串会丢失。我想在搜索框中保留搜索字符串。我正在尝试使用 javascript cookie 来实现这一点，因为我觉得它是最简单的解决方案之一。但我没有得到想要的结果。这是搜索表单的代码：

<form id="ds-search-box" method="post">

                        <xsl:attribute name="action">

                            <xsl:value-of select="/dri:document/dri:meta/dri:pageMeta/dri:metadata[@element='contextPath']"/>
                            <xsl:value-of
                                    select="/dri:document/dri:meta/dri:pageMeta/dri:metadata[@element='search'][@qualifier='simpleURL']"/>

                        </xsl:attribute>
        <div class="wrap right rounded">

                <input type="text" class="search left rounded" id="text-search" placeholder="Type name of book title, author, subject , keywords...">
                 <xsl:attribute name="name">
                                    <xsl:value-of
                                            select="/dri:document/dri:meta/dri:pageMeta/dri:metadata[@element='search'][@qualifier='queryField']"/>
                                </xsl:attribute>

            <!--</input>

                <input class="button-field" type="submit" i18n:attr="value"
                                   value="xmlui.general.go">-->

                                <xsl:attribute name="onsubmit">
                                <xsl:text>

                                    var a = document.getElementById(&quot;text-search&quot;);
                document.cookie = a.value;
                var s=document.cookie;
                alert(s);

                var form = document.getElementById(&quot;ds-search-box&quot;);              


                                    form.action=



                                </xsl:text>
                                    <xsl:text>&quot;</xsl:text>
                                    <xsl:value-of
                                            select="/dri:document/dri:meta/dri:pageMeta/dri:metadata[@element='contextPath']"/>
                                    <xsl:text>/handle/&quot; + radio.value + &quot;</xsl:text>
                                    <xsl:value-of select="/dri:document/dri:meta/dri:pageMeta/dri:metadata[@element='search'][@qualifier='simpleURL']"/>
                                    <xsl:text>&quot; ; </xsl:text>
                                <xsl:text>



                                </xsl:text>
                                </xsl:attribute>
        </input>    

        </div>
    </form>

我将文本框的值保存在 cookie 中。

我已经将此代码包含在page-structure.xsl文件的 javascript 部分中以访问 cookie：

<script type="text/javascript">
        document.getElementById(&quot;text-search&quot;).value=document.cookie;

</script>

Answer 1

原来我没有正确存储和检索 cookie。我将代码更改如下，现在可以正常工作：

设置cookie的代码：

<input class="button-field" type="submit" i18n:attr="value"
                                   value="xmlui.general.go" style="visibility:hidden">

                                <xsl:attribute name="onclick">
                                <xsl:text>

            <!--Poonam (code added to create cookie)--> 
                                    var a = document.getElementById(&quot;text-search&quot;);
                //alert(a.value);

                document.cookie = "search=; expires=Thu, 01 Jan 1970 00:00:00 UTC"; //delete previous cookie

                document.cookie = &quot;search&quot;+&quot;=&quot;+a.value+&quot;;&quot;; //create new cookie
                //alert("Hello"+document.cookie);
            <!--Poonam-->

                var form = document.getElementById(&quot;ds-search-box&quot;);              


                                    form.action=



                                </xsl:text>
                                    <xsl:text>&quot;</xsl:text>
                                    <xsl:value-of
                                            select="/dri:document/dri:meta/dri:pageMeta/dri:metadata[@element='contextPath']"/>
                                    <xsl:text>/handle/&quot; + radio.value + &quot;</xsl:text>
                                    <xsl:value-of select="/dri:document/dri:meta/dri:pageMeta/dri:metadata[@element='search'][@qualifier='simpleURL']"/>
                                    <xsl:text>&quot; ; </xsl:text>
                                <xsl:text>



                                </xsl:text>
                                </xsl:attribute>

        </input>

每当用户执行搜索时，搜索字符串都会存储在名为 的 cookie 中search。该代码首先删除了以前的 cookie，然后再创建一个新的。

<script type="text/javascript">

        window.onload = function (){


                var cookie_string = getCookie("search");

                //alert(cookie_string);
                document.getElementById(&quot;text-search&quot;).value = cookie_string;



        }

        function getCookie(cname) {
                var name = cname + "=";
            var ca = document.cookie.split(';');
                for(var i=0; i!=ca.length; i++) {

                var c = ca[i];

                while (c.charAt(0)==' ') c = c.substring(1);

                if (c.indexOf(name) == 0) 
                return c.substring(name.length,c.length);
                }
            return "";
    } 


    </script>

这会读取 cookie 并将其设置在搜索框中。