javascript - 如果使用 jquery/javascript 将 url 设置为特定值，如何隐藏和显示 div？

Question

我通过 url 发送一个特定的值，然后我的页面得到刷新。URL 值是动态的。每当设置 URL 时，我想显示已经隐藏的 div。

<button  id="show_id"  onclick="location.href='opdcasepaperreport.php?patient_nm='+document.getElementById('patient_id').value;" > View Report </button>

当用户点击 View Report 时，将显示报告 div。我尝试了以下 2 种编码方法:

$( document ).ready(function()
{
    $("#show_id").click(function()
   {
       $('#main').toggle();

  });

});

和

$(document).ready(function () 
{
   if(window.location.href.indexOf("?patient_nm"))
   {
       //alert("your url contains ");
       //show code;
  }
});

在第一种情况下，由于页面刷新 div 再次变得可见和不可见。有没有像在 php 中这样的解决方案 if(isset(---)){//do this;}

Answer 1

更改 location.href 值将刷新页面。

为了根据 url 值隐藏/显示 div，您需要:

1. 通过在 url 参数中搜索来获取值。
2. 显示/隐藏分区。

获取 URL 参数。

您可以使用此脚本来获取 url 参数:

 var getQuery = function () {
  var url_params = {};
  var query = window.location.search.substring(1);
  if (query.length === 0) return false;
  var vars = query.split("&");
  for (var i=0;i<vars.length;i++) {
    var pair = vars[i].split("=");
    if (typeof url_params[pair[0]] === "undefined") {
      url_params[pair[0]] = pair[1];
    } else if (typeof url_params[pair[0]] === "string") {
      var arr = [ url_params[pair[0]], pair[1] ];
      url_params[pair[0]] = arr;
    } else {
      url_params[pair[0]].push(pair[1]);
    }
  } 
 return url_params;
};

它将返回一个对象(键，值)。

显示/隐藏 div

如果你使用 jQuery，你可以简单地是 .toggle()

$("#your_div_name").toggle();

或者使用 .show()/.hide()

所以:

var query = getQuery();
if (query && query.some_param !== undefined) {
    $("#your_div_name").show()
} else {
    $("#your_div_name").hide()
}

但是最好不要使用 url 参数来改变 View 。

玩得开心。