0

我正在尝试在基础中建立一个站点。我正在为下一部分而苦苦挣扎。

首先让我展示一部分代码:

<dl class="contained tabs">
    <dd class="active"><a href="#contactForm">Neem contact op</a></dd>
    <dd><a href="#hoofdleiders">Hoofdleiders</a></dd>
    <dd><a href="#leiders">Leiders</a></dd>
    <dd><a href="#staf">Staf</a></dd>
  </dl>

<ul class="tabs-content contained">

    <li id="contactFormTab" class="active">
      <div class="row collapse">
        <div class="two columns"><label class="inline">Naam</label></div>
        <div class="ten columns"><input type="text" name="naam" id="naam" placeholder="Naam" value="' . (isset($_POST['naam']) ? htmlspecialchars($_POST['naam']) : '') . '" />
      </div>
      <div class="row collapse">
        <div class="two columns"><label class="inline">Email</label></div>
        <div class="ten columns"><input type="text" name="mail" id="mail" placeholder="jouwnaam@jouwadres.nl" value="' . (isset($_POST['mail']) ? htmlspecialchars($_POST['mail']) : '') . '" />
      </div>
      <div class="row collapse">
        <div class="two columns"><label class="inline">Onderwerp</label></div>
        <div class="ten columns"><input type="text" name="onderwerp" id="onderwerp" placeholder="onderwerp" value="' . (isset($_POST['mail']) ? htmlspecialchars($_POST['onderwerp']) : '') . '" />
      </div>

      <label>Wat wilt u zeggen?</label>

      <textarea id="bericht" name="bericht" rows="3">' . (isset($_POST['bericht']) ? htmlspecialchars($_POST['bericht']) : '') . '</textarea><br />

      <button type="submit" name="submit" class="radius button">Verstuur</button>

    </li>

<li id="hoofdleidersTab">
      <ul class="block-grid five-up">
        <li><a href="mailto:mal@serenity.bc.reb"><img src="http://placehold.it/200x200&text=[persoon]" /><br />Naam 1</a></li>
        <li><a href="mailto:zoe@serenity.bc.reb"><img src="http://placehold.it/200x200&text=[persoon]" /><br />Naam 2</a></li>

      </ul>
    </li>
    <li id="leidersTab">
      <ul class="block-grid five-up">
        <li><a href="mailto:mal@serenity.bc.reb"><img src="http://placehold.it/200x200&text=[persoon]" /><br />Naam 1</a></li>
        <li><a href="mailto:zoe@serenity.bc.reb"><img src="http://placehold.it/200x200&text=[persoon]" /><br />Naam 2</a></li>

      </ul>
    </li>
    <li id="stafTab">
      <ul class="block-grid five-up">
        <li><a href="mailto:mal@serenity.bc.reb"><img src="http://placehold.it/200x200&text=[persoon]" /><br />Naam 1</a></li>
        <li><a href="mailto:zoe@serenity.bc.reb"><img src="http://placehold.it/200x200&text=[persoon]" /><br />Naam 2</a></li>

      </ul>
    </li>

因此 dd 类“活动”和 li 类“活动”,使选项卡突出显示。

我的问题是,如何<dd>使用 URL 中传递的变量将课程更改为另一个项目(比如说第二个)和另一个 li id(也可以说第二个)(hoofdleiders)?

这是联系表格的一部分,我希望能够将人们带到他们需要的地方。

4

3 回答 3

0

如果你不想渲染页面,你可以使用 PHP,如:

<? if ($_GET['param_name'] == 'somecondition'):?>
<html do something>
<?endif;?>

或者您可以在页面呈现与用户操作交互后使用 jquery 进行:

function getURLParameter(name) {
return decodeURI(
    (RegExp(name + '=' + '(.+?)(&|$)').exec(location.search)||[,null])[1]
);
}

你可以使用这个函数来获取url中的参数,并在javascript/jquery上做一些逻辑来做一些很酷的事情。如果您需要更多信息,请告诉我。

于 2013-01-17T15:52:47.350 回答
0

我不建议以这种方式实施。您应该使用像 MVC 这样的框架或模式来更好地管理您的代码。但是,就您而言,这可能是一个简单而清晰的解决方案。

将每个选项卡存储在与选项卡同名的单独 php 文件中,例如,staf.php文件将如下所示:

  <ul class="block-grid five-up">
    <li><a href="mailto:mal@serenity.bc.reb"><img src="http://placehold.it/200x200&text=[persoon]" /><br />Naam 1</a></li>
    <li><a href="mailto:zoe@serenity.bc.reb"><img src="http://placehold.it/200x200&text=[persoon]" /><br />Naam 2</a></li>
 </ul>

主要contact.php会是这样的

<?php 
# list all available tabs
$tabs = array(
   'contactform' => 'Contact form', 
   'hoofdleiders' => 'Hoofdleiders', 
   'leiders' => 'Leiders', 
   'staf' => 'Staf',
);

# get the selected Tab from the url, if no tab is specified use the first tab
$selectedTab = filter_input(INPUT_GET, 'tab');
if (!in_array($selectedTab, $tabs))
    $selectedTab = $tabs[0];
?>   
<dl class="contained tabs">
    <?php foreach($tabs as $name => $label):?>
    <dd <?php echo ($tabName == $selectedTab ? "class='active'" : ""; ?>><a href="#<?php echo $name ?>"><?php echo $label ?></a></dd>
    <?php endforeach; ?>
</dl>

<ul class="tabs-content contained">
<?php foreach($tabs as $tabName): ?>
    <li id="<?php echo $tabName; ?>" <?php echo ($tabName == $selectedTab ? "class='active'" : ""; ?>>
        <?php require_once ($tabName . ".php"); ?>
    </li>
<?php endforeach; ?>
</ul>

在这种情况下,contact.php每个的 php 文件和所有 php 文件li必须在同一个文件夹中,并且可以contact.php像这样在 URL 中调用该文件contact.php?tab=staf

于 2013-01-17T16:03:49.357 回答
0

如果您不想遍历项目,可以使用 IF 子句添加活动状态:

<dl class="contained tabs">
 <dd<?php if(!isset($_GET['tab']) || $_GET['tab']=='contactform') echo ' class="active"'; ?>>
      <a href="#contactForm?tab=contactform">Neem contact op</a>
 </dd>
 <dd<?php if($_GET['tab']=='hoofdleiders') echo ' class="active"'; ?>>
      <a href="#hoofdleiders?tab=hoofdleiders">Hoofdleiders</a>
 </dd>
 <dd<?php if($_GET['tab']=='leiders') echo ' class="active"'; ?>>
      <a href="#leiders?tab=leiders">Leiders</a>
 </dd>
 <dd<?php if($_GET['tab']=='staf') echo ' class="active"'; ?>>
      <a href="#staf?tab=staf">Staf</a>
 </dd>
</dl>

我添加!isset($_GET['tab']) ||到第一个选项卡,以便此选项卡是默认选项卡(如果$_GET['tab']未设置)。

然后为每个LI添加相同的 PHP:

<li id="contactFormTab"<?php if(!isset($_GET['tab']) || $_GET['tab']=='contactform') echo ' class="active"'; ?>>

...

<li id="hoofdleidersTab"<?php if($_GET['tab']=='hoofdleiders') echo ' class="active"'; ?>>

...

<li id="leidersTab"<?php if($_GET['tab']=='leiders') echo ' class="active"'; ?>>

...

<li id="stafTab"<?php if($_GET['tab']=='staf') echo ' class="active"'; ?>>
于 2013-01-17T15:49:46.507 回答