加入代码显示一个特定的div URL

我有这样的代码为例：加入代码显示一个特定的div URL

<html> 
<head> 

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 

<script type="text/javascript"> 
function showonlyone(thechosenone) { 
    $('.newboxes').each(function(index) { 
      if ($(this).attr("id") == thechosenone) { 
       $(this).show(200); 
      } 
      else { 
       $(this).hide(600); 
      } 
    }); 
} 
</script> 

</head> 

<body> 

      <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px; width: 150px;"> 
       <a id="myHeader1" href="javascript:showonlyone('newboxes1');" >show this one only</a> 
      </div> 
      <div class="newboxes" id="newboxes1" style="border: 1px solid black; background-color: #CCCCCC; display: block;padding: 5px; width: 150px;">Div #1</div> 


      <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px; width: 150px;"> 
       <a id="myHeader2" href="javascript:showonlyone('newboxes2');" >show this one only</a> 
      </div> 
      <div class="newboxes" id="newboxes2" style="border: 1px solid black; background-color: #CCCCCC; display: none;padding: 5px; width: 150px;">Div #2</div> 

      <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px; width: 150px;"> 
       <a id="myHeader3" href="javascript:showonlyone('newboxes3');" >show this one only</a> 
      </div> 
      <div class="newboxes" id="newboxes3" style="border: 1px solid black; background-color: #CCCCCC; display: none;padding: 5px; width: 150px;">Div #3</div> 

</body> 
</html>

在不同的页面，我想有一个链接，将显示事业部＃2当用户负载点击该外部链接。我想通过对URL的某种调整，这种事情是可能的。例如：domain.com/page.php?=showdiv2

任何帮助都很好，我对编码的知识是有限的（特别是对于PHP），所以如果您选择帮助，请详细说明。

来源

2012-08-03 Henrik Petterson

有很多方法可以完成你想在这里做的事情。我将解释如何使用$_GET来做到这一点。

您可以用$_GET变量（在URL的末端控制这一点，只需添加?varName=value其中varName是一个变量的名称（这是任意的），并且value是要分配给它的价值。

然后在你的PHP代码，你可以根据它的价值访问由一）检查是否存在以及b）执行逻辑这个变量：

<?php 
    $divToShow = isset($_GET['div']) ? $_GET['div'] : ""; 

    //logic here 
?>

因此，例如，如果你想<div id="div_2">要显示的，你可以在jQuery的通过写作堵塞此：

<script language="javascript" type="text/javascript"> 
    $("div#div_<?= $divToShow ?>").show(); 
    $("div:not(#div_<?= $divToShow ?>)").hide(); 
</script>

，或者你可以简单地强制PHP仅打印出来DIV＃2：

<?php 
// set $divId to a value 

if ($divId == $divToShow) : ?> 
    <div id="<?= $divId ?>"> 
     <!-- content here --> 
    </div> 
<?php endif; ?>

来源

2012-08-03 19:42:39 Matt

你可以这样做使用Javascript/jQuery的只有通过检查URL的页面加载散列部：

http://mydomain.com/some/path#showcontainer1

HTML

？

<div class="container_one" style="display:none;">Content</div> 
<div class="container_two" style="display:none;">Other Content</div>

$(function(){ 

    switch(window.location.hash){ 
    case '#showcontainer1': //if hash is #showcontainer1 
     $('.container_one').fadeIn(); //fadein the container with some class 
     break; 
    default: 
     $('.container_two').fadeIn() //else fade container with other class 
     break; 
    } 

});

来源

2012-08-03 19:44:31

如何定义哪个div是哪个容器？你能提供进一步的代码来表达这个吗？ – 2012-08-03 20:35:55

更新了答案。请注意，此解决方案不涉及动态加载内容，而只是根据URL显示/隐藏某些容器。 – 2012-08-04 08:05:10

我会用PHP，这样的代码时：

page.php文件ID = idofdiv

<html> 
<head> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
<script type="text/javascript"> 
function showonlyone(thechosenone) { 
$('.newboxes').each(function(index) { 
     if ($(this).attr("id") == thechosenone) { 
      $(this).show(200); 
     } 
     else { 
      $(this).hide(600); 
     } 
}); 
} 
$(document).ready(function(){ 
$("#<?php echo $_GET['id']; ?>").show(); 
}); 
</script> 
</head> 
<body> 

     <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px; width: 150px;"> 
      <a id="myHeader1" href="javascript:showonlyone('newboxes1');" >show this one only</a> 
     </div> 
     <div class="newboxes" id="newboxes1" style="border: 1px solid black; background-color: #CCCCCC; display: block;padding: 5px; width: 150px;">Div #1</div> 


     <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px; width: 150px;"> 
      <a id="myHeader2" href="javascript:showonlyone('newboxes2');" >show this one only</a> 
     </div> 
     <div class="newboxes" id="newboxes2" style="border: 1px solid black; background-color: #CCCCCC; display: none;padding: 5px; width: 150px;">Div #2</div> 

     <div style="border: 1px solid blue; background-color: #99CCFF; padding: 5px; width: 150px;"> 
      <a id="myHeader3" href="javascript:showonlyone('newboxes3');" >show this one only</a> 
     </div> 
     <div class="newboxes" id="newboxes3" style="border: 1px solid black; background-color: #CCCCCC; display: none;padding: 5px; width: 150px;">Div #3</div>

我所做的是：

$(document).ready(function(){ 
$("#<?php echo $_GET['id']; ?>").show(); 
});

当PHP解析（这是服务器端），它会发送url中给出的ID（$ _ GET [“身份证”]）到jQuery代码中解析。这个代码将在文档准备就绪时执行。

如果$ _GET ['id']为空或不存在，则不会发生任何事情（没有显示div）。

来源

2012-08-03 19:45:43

一如既往有很多解决方案，但是我们在一个应用程序中有一个类似的要求，我们希望一个页面向另一个页面发送消息以显示给用户。例如，更新设置后返回主页面，并在顶部显示消息“设置更新”。我们的解决方案是在URL中发送消息，然后在每个页面上运行一个JavaScript，以在url中查找消息。如果它在那里显示给用户，如果它不在那里，则什么都不会发生。

在我们共同的页面加载程序（在每一页上的JavaScript）我们做

if (jQuery.query.get('fadeMessage')) 
{ 
    FadeMessage(jQuery.query.get('fadeMessage')); 
}

然后FadeMessage被定义为：

function FadeMessage(message) { 
jQuery('#fadeMessage').html(message).animate({ "top": "0" }, 1000).delay(2000).animate({ "top": "-80px" }, 1000);

}

的 “fadeMessage” 分区上每页作为：

<div id="fadeMessage"> 
</div>

虽然当我输入这个时，我想我们可以在需要时注入该div。嗯... :-)

来源

2012-08-03 19:48:17

有两个步骤要做：首先我们需要知道如何在我们的域中使用参数，最后需要切换内容。

1）您可以添加参数到被叫文件如下：

http://server/path/file?key=value

对于这方面的例子，让我们使用的关键page。因此，这些将是你需要链接的URL：

http://server/path/file?page=div-1 
http://server/path/file?page=div-2

2）分割你的代码包含所有这就是在那里，现在和两个的，叫任何你喜欢的，例如一个php文件div-1.php和div-2.php。进入后者你复制特定的div-1和div-2内容。

3）最后打开你的主php文件，并删除div-1和div-2。他们现在都应该在其他文件中。并输入以下PHP代码：

<?php 
if (isset($_REQUEST['page']) === false || in_array($_REQUEST['page'], array('div-1', 'div-2')) === false) { 
    $_REQUEST['page'] = 'div-1'; 
} 
include $_REQUEST['page'] . '.php'; 
?>

的网址将调用PHP文件，这是推动其内容到浏览器，并同时推动它的执行我们把脚本中的脚本验证如果URL参数页面设置。，检查它是否有效，并将第二个文件放在我们之前放置脚本的位置。由于安全原因，后面的检查非常必要（见下文）！

注意：以下代码行用于显示默认页面，例如， index或start。它可以很容易地改变。

$_REQUEST['page'] = 'div-1';

注：我们需要关心安全性，因此不允许页面不存在。如果我们不这样做，可以执行服务器上的各种php脚本。只需在if语句中更改，编辑或添加其他元素：

array('div-1', 'div-2')

来源

2012-08-03 19:52:32

加入代码显示一个特定的div URL

回答

相关问题