Question

这是一项家庭作业，我将不得不创建“ x”个按钮，当我单击任何按钮时，应将其值/标签从“ buttonX”更改为“ clicked”。通过单击另一个按钮，第一个按钮将重置为“ buttonX”，新按钮将变为“单击”。到目前为止，我已经能够创建数量为“ x”的按钮，但是我不知道如何使它们可单击以来回更改其值。

这是我的模特：

namespace buttonTag.Models {
    public class Button {
        private const int QTY_BTN = 10;

        public Button() {

        }

        public int buttons {
            get {
                return QTY_BTN;
            }
        }
    }
}

这是我的剃刀页面：

@model buttonTag.Models.Button;

<form asp-controller="Home" asp-action="Button">
    <div class="form-group">
        @{
            for(int i=1; i<@Model.buttons + 1; i++) {
                <input type="submit" value=@("Button" + i) class="btn btn-primary ml-4 mb-4" />
            }
        }
    </div>

</form>

有帮助吗？

Answer 1

这是一个简单的解决方法，如下所示：

<form asp-controller="Home" asp-action="Button">
    <div class="form-group">
        @{
            for (int i = 1; i < @Model.buttons + 1; i++)
            {
                <input type="button" id="@i" value=@("Button" + i) class="btn btn-primary ml-4 mb-4" onclick="Test(@i)" />
            }
        }
    </div>

</form>
@section Scripts{ 
<script>
    var item;
    function Test(i) {
        if (i != item) {
            if (($("#" + i)).val().startsWith('Button')) {
                $("#" + i).val("Clicked");
            }
        }      
        $("#" + item).val("Button" + item);
        item = i;
        return item;
    }

</script>
}

结果：

如何在单击时将按钮值从“ buttonX”更改为“ clicked”？

1 个答案: