1

我有两个选择框,例如,

<select name="template" id="template">
        <option value="" selected>--Select--</option>
            <option value="HOME">Home</option>
            <option value="HELP">How We Help</option>
            <option value="CONTACT">Contact Us</option>
            <option value="ABOUT">About Us</option>
</select>

<select name="location" id="location"">
    <option value="" selected>--Select--</option>
            <option value="header">Header</option>
            <option value="center">Center</option>
            <option value="footer">Footer</option>
    </select>

问题是,在第二个选择框中,只有联系我们模板需要中心位置。如何隐藏所有其他模板的中心选项?

4

4 回答 4

4

在不知道其余代码的情况下,假设它只是简单的 PHP(无框架)

<select name="location" id="location"">
<option value="" selected>--Select--</option>
        <option value="header">Header</option>
        <?php if ($template == 'contact_us'):?>
        <option value="center">Center</option>
        <?php endif;?>
        <option value="footer">Footer</option>
</select>

将 center 选项包装在一个测试当前模板类型的简单 if 块中,将允许您根据加载的页面显示或隐藏值。

如果你在一个框架中,可能有更好的方法来做到这一点,但如果你只是使用普通的 PHP,我的建议会起作用。

于 2013-04-08T09:16:12.020 回答
1

只需将您的静态值替换<option>为所需的变量

value="<?php echo $variable;?>"

在隐藏它时,您必须为联系页面设置一个条件示例,您设置一个变量$page='Contact_Us'意味着该页面是contact_us。然后在您的选项中创建一个条件,这将使选项中心仅在唯一时$page='Contact_Us'显示

//Define variable `$page` in contact_us page
$page='Contact_Us';

<select name="location" id="location"">
    <option value="" selected>--Select--</option>
            <option value="header">Header</option>
            <?php if($page == 'Contact_US'){?>
            <option value="center">Center</option> 
            <?php }?>
            <option value="footer">Footer</option>
    </select>
于 2013-04-08T09:10:12.823 回答
1

1)隐藏一个中心选项:jsfiddle here

2)在php中设置选项值:

  • 替换<option value="header"></option><option value="<?php include('myScript.php') ?>"></option>
  • 然后在myScript.php中,echo "newValue";
于 2013-04-08T09:18:47.927 回答
1

试试这个:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
<script>
    $(document).ready(function(){
        $('#template').change(function(){
            var template = $(this).val()
                ,option = $('#container > select > option');
            if(template=="CONTACT")
                $('#location > option[value="header"]').after(option.clone());
            else
                $('#location > option[value="center"]').remove();
        }).change();
    });
</script>
<select name="template" id="template">
    <option value="" selected>--Select--</option>
    <option value="HOME">Home</option>
    <option value="HELP">How We Help</option>
    <option value="CONTACT">Contact Us</option>
    <option value="ABOUT">About Us</option>
</select>
<select name="location" id="location">
    <option value="" selected>--Select--</option>
    <option value="header">Header</option>
    <option value="footer">Footer</option>
</select>
<div id="container" style="display: none">
    <select>
        <option value="center">Center</option>
    </select>
</div>
于 2013-04-08T09:30:36.587 回答