如何添加必需的属性？答案

【问题标题】：How to add a required attribute?如何添加必需的属性？
【发布时间】：2015-11-26 18:44:35
【问题描述】：

我有一个脚本，显示一些并隐藏一些 html，但我不知道如何在显示时添加所需的标签，我已经尝试在我想要的部分中添加属性，但即使在未显示...有人可以帮助我吗？提前致谢！

<div  class="start"><select name="start" class="form-control">
           <option value="0" class="select">Select City</option>
                <?php foreach($rows as $row): ?> 
                    <option <? echo 'value="'.$row['id'].'"';
                        echo ($row['id'] == $job['start'])?' selected>':'>'; 
                        echo $row['name']; ?></option>
                <?php endforeach; ?>
            </select></div><br />
            <br />
            <script>
            $('select[name=start]').change(function () {
                if ($(this).val() == '89') {
                    $('#otherStart').show();
                } else {
                    $('#otherStart').hide();
                }
            });
            </script>
            <br />
            <div id="otherStart">
                <input type="text" name="otherStart" placeholder="Other City" <? echo ($job['otherStart'])?' value="'.$job['otherStart'].'"':''; 
            ?> class="form-control" >
            </div>

【问题讨论】：

required 属性？将它添加到什么元素以及何时添加？ $('#otherStart').show().attr("required", "required");。你应该用jquery btw 标记你的问题，因为你正在使用它。

标签： javascript php html required

【解决方案1】：

为了使 jQuery 需要某个元素，你应该使用.prop:

$(selector).prop("required", true);

你也可以在 JavaScript 中使用属性required：

element.required = true;

或者再次，

element.setAttribute("required","");

【讨论】：

【解决方案2】：

首先，您需要为您正在修改的输入分配一个id-attribute，以便我们可以使用jQuery 更改属性。您已经使用 <div id="otherStart"> 来显示/隐藏整个 div，因此请选择其他名称，例如 id="inputOtherStart"（ID 应该始终是唯一的）。

然后我们在显示和隐藏div时分别使用jQuery添加和删除属性。

<script>
$(function() {
    // Function to show/hide the extra subject-field, and making it required or not
    var Start = '#Start';
    var otherStart = '#otherStart';
    var otherStartInput = '#otherStartInput';

    $(otherStart).hide(); 
    $(Start).change(function(){
        if($(Start).val() == 89) {
            $(otherStart).show();
            $(otherStartInput).prop('required',true);
        } else {
            $(otherStart).hide(); 
            $(otherStartInput).prop('required',false);
        } 
    });
});
</script>
<br />
<div id="otherStart">
    <input type="text" id="otherStartInput" name="otherStart" placeholder="Other City" <? echo ($job['otherStart'])?' value="'.$job['otherStart'].'"':''; ?> class="form-control" />
</div>

【讨论】：

我尝试过这样做，这是有道理的，但由于某种原因它没有添加属性
您是否将id-属性添加到input？以及您如何检查它没有添加属性（检查代码不起作用）。
@MrJohnDowe 现在试试，我已经更新了 jQuery 脚本。也对其进行了测试，只要input 具有适当的id，这个应该可以工作。
我无法正确测试它，因为现在选择 Other 时 otherStart 不会显示
这不是目的吗？如果需要，您可以在测试时注释掉处理hide() 和show() 的行。不过，我已经对其进行了测试，并且此代码按预期工作。

【解决方案3】：

要在 div 显示和隐藏时添加和删除“必需”属性，您可以将 JavaScript 修改为-

          <script>
            $('select[name=start]').change(function () {
                if ($(this).val() == '89') {
                    $('#otherStart').show();
                    $('#otherStart : input').attr('required');
                } else {
                    $('#otherStart').hide();
                    $('#otherStart : input').removeAttr('required');
                }
            });
            </script>

【讨论】：