如何使用 Javascript 或 jQuery 从 URL 获取查询字符串以填充选择值

How to get query string from URL using Javascript or jQuery to populate select values?

本文关键字:字符串 查询 填充 选择 获取 URL Javascript 何使用 jQuery      更新时间:2023-09-26

我有 3 个选择或选项下拉列表,根据用户选择的内容需要根据查询字符串填充或选择下拉列表的选择值。所以我想我需要帮助获取 URL 和查询字符串,并找出它是否包含用户选择填充选择值的任何内容。

现在,当用户选择它们然后提交搜索时,我的选择值不会持久。 我如何让它们在Javascript或jQuery中持久化?我的另一个问题是用户可以搜索所有选项,我有它的工作,但有一个复选框放置一个值,读取该值以搜索所有内容。在第一次页面加载时,我将如何选中该复选框并查询字符串"?search=%20%20%20%200"以填充 URL 查询字符串。 提前谢谢。

这是我目前的JS:

var resourceGradeId;
var resourceContentId;
var resourceProgramTypeId;
var resourceSearchAll;
$(document).ready(function() {
var searchAll = '<strong>' + "All" + '</strong>';
$('#xsltsearch_summary .dmnsSearchResultNumber:contains("0")').replaceWith(searchAll); 
$("#resourceSelect").click(function (event) { 
resourceGradeId = $('#teachersResourceSearchGrade').val();
 resourceContentId = $('#teachersResourceSearchContent').val();
 resourceProgramTypeId = $('#teachersResourceSearchProgramType').val(); 
resourceSearchAll = $('#teachersResourceSearchAll').val();
window.location.href = '/teachers/classroom-resources?search=' + resourceGradeId + ' ' + resourceContentId + ' ' + resourceProgramTypeId + ' ' + resourceSearchAll;
    });
$("select option").attr('disabled', false);
    $(":checkbox").click(function(event) { 
    //reset values
    if($(":checkbox").is(":checked")){
          $("#teachersResourceSearchGrade").val('');
          $("#teachersResourceSearchContent").val('');
          $("#teachersresourceProgramTypeId").val('');
          $("#teachersResourceSearchAll").val('0');
          $("select").attr('disabled', true);
        }
    else
        { 
          $("#teachersResourceSearchAll").val('');
          $("select").attr('disabled', false);
          $("select option").attr('disabled', false);
          }
     });
});

检查 url 中的变量

getUrlVars()["search"];

这会得到 example.com/page 的价值吗?搜索=yolo%20no

为了说明搜索的价值,它只是一个形式

<form method="get"><input type="text" name="search"/></form>

这与选择菜单相同

<form method="get"><select name="dropdown"><option>Option 1</option></select></form>

刚刚用了这个

var myQuery = window.location.search.substring(1);
// alert(myQuery);
if(myQuery == ''){
  window.location.href = document.URL + '?search=%20%20%200';
$(":checkbox").attr('checked', 'checked');
//alert('no query');
}else if(myQuery == 'search=%20%20%200'){
  $(":checkbox").attr('checked', 'checked');
} 
else{
}