首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >根据单选按钮显示div (带POST)

根据单选按钮显示div (带POST)
EN

Stack Overflow用户
提问于 2020-12-23 12:08:38
回答 1查看 32关注 0票数 0

我知道有很多类似的问题,但我还没有找到完全符合我的想法的东西。我在第一页(和其他内容)上有一个单选按钮,还有一个提交按钮,可以将一些数据提交到另一个页面。在第二个页面上,我有两个div2,如果在第一个页面上选择了option1,我想显示div1,如果选择了option2,则显示div2。看起来很简单,但我遇到了麻烦。谁能帮帮我?下面是我的代码:

第1页

代码语言:javascript
运行
复制
<form method=post action='page2.php'>
  <input type="radio" id="option1" value="option1" name="options">
  <input type="radio" id="option2" value="option2" name="options">
  <button>Submit</button>
</form>

第2页

代码语言:javascript
运行
复制
<?php $options = $_POST['options']; ?>
<div id="Div1" style="display: none"></div>
<div id="Div2" style="display: none"></div>

JS

代码语言:javascript
运行
复制
$(function() {
 if ($options == 'option1') {
  document.getElementById(Div1).style.display = "block";
  document.getElementById(Div2).style.display = "none";
 }
 else if ($options == 'option1') {
  document.getElementById(Div2).style.display = "block";
  document.getElementById(Div1).style.display = "none";
 }
 return false;
});
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2020-12-23 12:29:48

使用php echo是将PHP变量向下传递给客户端javascript的一种方式:

代码语言:javascript
运行
复制
<?php $options = $_POST['options']; ?>
<div id="Div1" style="display: none"></div>
<div id="Div2" style="display: none"></div>
<script>
  $(function() {
   var $options = "<?php echo $options ?>"
   if ($options == 'option1') {
    document.getElementById(Div1).style.display = "block";
    document.getElementById(Div2).style.display = "none";
   }
   else if ($options == 'option1') {
    document.getElementById(Div2).style.display = "block";
    document.getElementById(Div1).style.display = "none";
   }
   return false;
  });
</script>

或者,您可以完全消除javascript和用户服务器端逻辑,以仅呈现所需的div:

代码语言:javascript
运行
复制
<?php $options = $_POST['options'];
    if ($options == "option1"){
        echo "<div id='Div1'></div>"; 
    } else {
        echo "<div id='Div2'></div>";
    }
?>
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/65418892

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档