使用 POST 发送 html 选择选项禁用属性，并在输入表单中使用 onclick 启用选择选项属性

Question

您好，我想通过 POST 发送 html 选择选项禁用属性，并在输入表单中通过 onclick 启用选择选项属性。 例如我有：

<script>
function checked(){
     var sel = document.getElementById("table A");  
    if(sel.options[sel.selectedIndex].text=='AAAA'){
         document.getElementById('table B').disabled = false;
    }
}

</script>


<?php
        print("<form method=\"POST\">");
        <print("<tr><th>Table A</th><td>
        <select id='table A' name='table1'>
                <option value=' '>Select</option>
                <option name='AAAA' value='A' onclick=\"checked()\">AAAA</option>
                <option name='BBBB' value='B'>BBBB</option>
        </select></td></tr>");
     print("<tr><th>Table B</th><td>
        <select id='table B' name='table2' disabled>
                <option value=' '>Select</option>
                <option name='BBB' value='B'>BBBB</option>
                <option name='CCC' value='C'>CCCC</option>
                </select></td></tr>");
        print("<tr><td><input type=\"submit\" id=\"save\" name=\"save\" value=\"Save\" ></td></tr>");

if(isset($_POST['save'])){
if(document.getElementById("table B").disabled){
            return ' ';
            }else{
                $type_modify=$_POST['table B'];
                }
?>

现在，如果我不禁用选择表单表 B，我想用 post ' ' 发送。如果我单击选择选项名称='AAAA'，我希望使用 id='table B' 启用选择。我的代码不起作用。为什么？

Answer 1

你可以这样做。

例如

<script>

function processForm(e) {
    if (e.preventDefault) e.preventDefault();

    var input = document.createElement('input');
    input.type = 'hidden';
    input.name = "my-disabled-check-input";
    input.value = document.getElementById('table B').disabled;
    this.appendChild(input);

    this.submit();
}

var form = document.getElementById('my-form');
if (form.attachEvent) {
    form.attachEvent("submit", processForm);
} else {
    form.addEventListener("submit", processForm);
}
</script>

您也可以在没有相同事件侦听器的情况下添加另一个 onclick 函数，然后使用 form.submit(); 提交表单；

然后在您的 PHP 文件中将其视为普通的 POST 变量。 如果我们像我设置的那样做，你会想看看$_POST['my-disabled-check-input'];。

在您的表单 html 中，您可以设置 POST URL。这个 URL 可以是显示表单的页面，也可以接收 POST 变量。如果您不熟悉这些术语，请查看https://www.w3schools.com/html/html_forms.asp

但基本上你可以设置一个“动作”，它只是 php 文件的 URL。

所以直接取自 W3schools 的表格如下所示。

<form action="/action_page.php">
  <label for="fname">First name:</label><br>
  <input type="text" id="fname" name="fname" value="John"><br>
  <label for="lname">Last name:</label><br>
  <input type="text" id="lname" name="lname" value="Doe"><br><br>
  <input type="submit" value="Submit">
</form>

如果想要一个 PHP 文件来显示表单并获取 $_POST 变量，我们可以这样做。

<?php
if($_POST) {
 echo "Post Variables sent";
 var_dump($_POST);
} else {
 echo "Where I will put my form HTML and JS.";
}
?>

您的 PHP 也可以像这样使用，以便更轻松地编写 HTML。

<?php if($_POST): ?>
    Your name is <?=$_POST['fname']?> <?=$_POST['lname']?>.
<?php else: ?>
    <form action="/action_page.php">
      <label for="fname">First name:</label><br>
      <input type="text" id="fname" name="fname" value="John"><br>
      <label for="lname">Last name:</label><br>
      <input type="text" id="lname" name="lname" value="Doe"><br><br>
      <input type="submit" value="Submit">
    </form>
<?php endif; ?>

这个<?=$_POST['fname']?> 等同于<?php echo $_POST['fname']; ?>，但更短一些，我喜欢在我的 HTML 视图中这样使用它。

此脚本不考虑任何用户输入解析，因此请记住这一点。您可能还想查看 HTML 5 表单验证，以确保输入只是您期望的信息以及 PHP 过滤用户输入。