PHP - if下拉选择=一些东西

PHP - if dropdown selection = something

本文关键字：选择 if PHP      更新时间：2023-09-26

如何创建一个基于下拉列表选择的条件语句?

假设我们有一个包含条目的下拉列表:

Alpha
Bravo
Charlie
Other

我想创建一个条件语句，如果Other是当前从下拉菜单中选择的条目，我想回显一个换行符，说明If Other, Please Specify。但如果它不是当前选择的条目，我不希望填充该字符串。

In PHP

<select id="conditions" name="conditions">
    <option></option>
<?php
foreach($option in $optionList){
    echo "<option value=$option ";
    if($_REQUEST["conditions"] == $option){
        echo  'selected="selected"';
    }
    echo " > $option </option>";
}
echo "</select>";
if($_REQUEST["conditions"] == "Other"){
    echo '<div id="specify" style="display:block">If Other, Please Specify</div>';
}else{
    echo '<div id="specify" style="display:hidden">If Other, Please Specify</div>';
}
?>

在jQuery中用于客户端

<script>
    $('#conditions').change(function(){
        if($(this).val() == "Other"){
            $('#specify').show();
        }else{
            $('#specify').hide();
        }
    });
</script>

正如注释所说，您需要在javascript中完成此操作。下面的函数可以做到这一点。

将此javascript包含在页面的<script>元素中，或包含在javascript文件中:

function checkSelect(selId, text, outputDiv) {
  var sel = document.getElementById(selId);
  var d = sel.options[sel.selectedIndex].text;
  if (d == text) {
    document.getElementById(outputDiv).innerHTML = "If Other, Please Specify";
  } else { 
    document.getElementById(outputDiv).innerHTML = "";
  }
}

当下拉菜单改变时，调整你的HTML来运行这个函数:

<select id='Sel1' onchange='check("Sel1", "Other", "DivReqDetails");'>
  <option value='Alpha'>Alpha</option>
  <option value='Bravo'>Bravo</option>
  <option value='Charlie'>Charlie</option>
  <option value='Other'>Other</option>
</select>
<div id='DivReqDetails'></div>

编辑:如果你有访问jQuery，你可以使checkSelect()更强大，做的不仅仅是调整div的内容(因为你可以很容易地调整CSS，如display:hidden; vs display:block;以及颜色。这里有一个例子，如果你碰巧有jQuery的支持。

我还添加了一些改进，让您将所需的文本发送到此函数(以便您可以让它检查多个字段并相应地显示不同的文本):

function checkSelect(selId, text, outputDiv, outputText) {
  if ($("#"+selId).text() == text) {
    $("#"+outputDiv).html(outputText).css("display","block").css("color","red");
  } else { 
    $("#"+outputDiv).html("").css("display","none").css("color","black");
  }
}

或者，如果要在表单的不同部分显示多个这样的警告，则可以根据CSS类而不是单个项来更改。注意，这将改变所有的警告div，所以如果你正在寻找每个字段的反馈，这不是去的方式…

function checkSelect(selId, text, outputCssClass, outputText) {
  if ($("#"+selId).text() == text) {
    $("."+outputCssClass).html(outputText).css("display","block").css("color","red");
  } else { 
    $("."+outputCssClass).html("").css("display","none").css("color","black");
  }
}

显然，您可以调整在这两种情况下所做的更改。如果您从来没有任何理由调整显示的文本，那么您应该完全删除.html()部分。类似地，如果你只在颜色是红色的时候显示这个div，放下那个调整，然后硬编码你想要的样式。您可以通过使用类似的调用.css()

来更改有关元素的任何其他css属性。
相关文章：