Question

如何根据下拉列表选择创建条件语句？

假设我们有一个带有条目的下拉列表：

Alpha
Bravo
Charlie
Other

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

Answer 1

在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>

Answer 2

正如评论所说，你需要在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，那么除了调整div的内容之外，您可以使checkSelect()更强大（因为您可以轻松调整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属性

PHP - 如果下拉选择=某事

2 个答案: