HTML表单编号类型唯一用户输入

HTML Form Number Type Unique User Input

本文关键字:用户 输入 唯一 类型 表单 编号 HTML      更新时间:2023-09-26

我使用下面的代码让用户对他们最喜欢的糖果进行排名(优先级)。用户需要从1-3进行排名(1是最好的)

<form id="form1" name="form1" method="post" action="">
<input type="number" name="cake" id="cake" required="required" max="3" min="1"/>Cake     <br />
<input type="number" name="twizlers" id="twizlers"required="required" max="3" min="1"/>Twizlers <br />
<input type="number" name="taffy" id="taffy" required="required" max="3" min="1"/>Taffy <br /><br />
<input type="submit" name="button" id="button" value="Submit" />
</form>

我正在使用HTML 5编码,以确保他们只使用数字1,2和3,但我怎么能确保他们不使用相同的数字两次?是否有一个HTML输入代码,我可以使用或有一些javascript代码需要?如果需要javascript,你有什么建议?

<script type="text/javascript">
    function item() {
        cake = Number(document.getElementById('cake').value);
        twizlers = Number(document.getElementById('twizlers').value);
        taffy = Number(document.getElementById('taffy').value);
        if (cake == twizlers) {
            alert("Some alert cake or twizlers");
            return false;
        } else if (twizlers == taffy) {
            alert("Some alert taffy or twizlers");
            return false;
        } else if (taffy == cake) {
            alert("Some alert taffy or cake");
            return false;
        } else {
            return true;
        }
    }
</script>

这个可以,否则你可以使用单选按钮

你可以使用JS检查,用户只对具有单个值的1个项目进行排名,并且不能再次对该项目进行排名。你可以用JS来做这件事。为输入字段插入ID,然后

    document.getElementById("your_id").disabled = false;
    document.getElementById("your_id").disabled = false;
    document.getElementById("your_id").disabled = false;
    var var1 = document.getElementById("your_id");
    var1.onchange = function () {
    if (this.disabled == true) {
     document.getElementById("your_id").disabled = true;
     }
    }

因此检查以下三项