如何根据查询字符串在页面上显示内容?

时间:2016-08-19 07:13:36

标签: javascript html css query-string

我正在与使用供应商的基于Web的应用程序的团队合作。当人们注销时,他们会被重定向到登录页面,我们希望在其中添加消息。我们无权更改代码(它是托管的云),但我们可以在URL中传递查询字符串参数。

我们可以做类似的事情:

http://our.site.com?logout=true

从那里,我想在h2或其他东西中显示一条消息。

我们可以自定义页面的HTML,CSS和JS,但我们无法访问应用程序的源代码(否则我会在PHP中执行此操作)。

我认为我可以使用JS来改变一些CSS,但在我所有的试验中,我都无法让CSS真正改变。

3 个答案:

答案 0 :(得分:2)

检查此答案:Get url parameter jquery Or How to Get Query String Values In js

var logout = getUrlParameter('logout');
if(typeof logout !== "undefined")
{
  // show some div with display: none
  // or put some content to the existing div
} 

答案 1 :(得分:1)

从上面的问题来看,我只是理解你需要一段代码来根据收到的查询字符串在你的登录页面上显示一些消息。以下是你可以在你的页脚中添加的一段代码。登录页面html(因为您可以访问html)。

<script type="text/javascript">
    function getParamValue(querystring) {
          var qstring = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');
          for (var i = 0; i < qstring.length; i++) {
            var urlparam = qstring[i].split('=');
            if (urlparam[0] == querystring) {
               return urlparam[1];
            }
          }
    }
    if(getParamValue('logout')=='true'){
         var messageDiv = document.createElement("div");       // Creating a div to display your message
         var message = document.createTextNode("You have successfully logged out.");  // Preparing the message to show
         messageDiv.appendChild(message);                     // Appended the message in newly created div

         var addIn = document.getElementById("login");       //just presuming there is a div having id="login" in which you want to prepend the message
         addIn.insertBefore(messageDiv, addIn.childNodes[0]); //just appended the message on top of login div
         //setting style in your message div
         messageDiv.style.backgroundColor ="#FF0000";
         messageDiv.style.width ="100%";
    }
    </script>

然后像这样更改登录页面的链接:

http://our.site.com/login.php?logout=true

注意:仔细阅读代码注释,根据您的html结构编辑代码。

答案 2 :(得分:0)

尝试!重要的是改变CSS?只是一个临时解决方案,直到您可以编辑实际代码。