0

创建了这个非常简单的代码来复制我的问题。如果输入文本没有值(正确),表单将不会提交。但如果未选择选择输入(不正确),它将提交。我可能在这里遗漏了一些非常基本的东西,但我不知道是什么。

编辑:刚刚意识到这在 Firefox 中有效;但不是铬。

编辑 2: Chrome 正在使用以下内容呈现我的页面,而不是我的代码中的内容。

<option value>Select</option>

任何想法为什么?如果重要的话,这是一个 .razor 页面。但根据其他研究,没有 value="" 是它在 Chrome 中不起作用的原因。

     <form>
        <div>
            Any Text: 
            <input type="text" required="required" />
        </div>
        <div>
            Country: 
            <select required="required">
                <option value="">Select</option>
                <option value="US">United States</option>
                <option value="CA">Canada</option>
            </select>
        </div>
        <div>
            <button type="submit">
                Test
            </button>
        </div>
    </form>

编辑 3:我通过以下解决方法让 HTML 在 Chrome 中正确呈现,但 Chrome 中的验证仍然不起作用:

  <form>
        <div>
            Any Text:
            <input type="text" required="required" />
        </div>
        <div>
            Country:
            <select required="required">
                <option value="@blankString">Select</option>
                <option value="US">United States</option>
                <option value="CA">Canada</option>
            </select>
        </div>
        <div>
            <button type="submit">
                Test
            </button>
        </div>
    </form>

@code {
    string blankString = "";
}

页面代码源:

<select required="required">
                <option value="">Select</option>
                <option value="US">United States</option>
                <option value="CA">Canada</option>
            </select>
4

1 回答 1

0

有同样的问题 - 最终使用 js 来禁用/启用按钮,如下所示:

从下拉列表中未选择任何选项时禁用按钮

于 2020-03-29T08:16:50.500 回答