使用javascript从url参数填充texbox值

Populate texbox value from url parameter using javascript?

本文关键字：填充 texbox 参数 url javascript 使用      更新时间：2024-05-03

我有以下脚本。在用户点击提交后，我想将用户重定向到同一页面，并用url中的参数值填充下拉框和输入框。不幸的是，一旦重定向完成，它们就不会填充。我还需要从FilterMultiValue参数中去掉*，以便在文本框中输入原始值？

我已经使用警报函数检查了参数值，这有效吗？

<script type="text/javascript">
function getUrlParams() {
        var paramMap = {};
        if (location.search.length == 0) {
            return paramMap;
        }
        var parts = location.search.substring(1).split("&");
        for (var i = 0; i < parts.length; i ++) {
            var component = parts[i].split("=");
            paramMap [decodeURIComponent(component[0])] = decodeURIComponent(component[1]);
        }
        return paramMap;
}
function RedirectUrl() {
    var tb = document.getElementById("tbSearch").value;
    var cs = document.getElementById("sfield").value;
    var url = "";
    if (tb != "") {
                url = "FilterName=" + cs + "&FilterMultiValue=*" + tb + "*";
                window.location.href = "mypage.aspx?" + url;
                var params = getUrlParams();
                alert(params.FilterName);
                document.getElementById("sfield").value = params.FilterName;
                document.getElementById('tbSearch').value = params.FilterMultiValue;

    }
    else {
            return false;
    }
} 
function ClearUrl() {
    window.location.href = "mypage.aspx";
        document.getElementById("sfield").value = "";
        document.getElementById('tbSearch').value = "";
}
</script>

 Search Field: 
  <select id="sfield">
    <option selected value="Title" >Title</option>
    <option value="Body">Body</option>
  </select>
 Search Text: 
   <input type="text" id="tbSearch" />
   <input type="button" id="btnSearch" value="Search" onclick="return RedirectUrl();" />
   <input type="button" id="btnClear" value="Clear" onclick="return ClearUrl();" />

 window.location.href = "mypage.aspx?" + url;

重新加载页面，这将导致此后的所有代码都无法执行。您想要做的是添加页面加载的代码，并检查是否给定了参数，然后填充文本框。类似于：

window.addEventListener('load', function(){
    var params = getUrlParams();
    if(typeof params.FilterName !== 'undefined'){
        // removes the first and the last char from the string
        var t = params.FilterMultiValue.substr(1, params.FilterMultiValue.length-2);
        document.getElementById("sfield").value = params.FilterName;
        document.getElementById('tbSearch').value = t;
    }
});
相关文章：