代码之家 › 专栏 › 技术社区 › Tal Rofe

如何获取HTML文本的值?

razor asp.net-mvc html jquery

Tal Rofe · 技术社区 · 7 年前

以下是我的部分HTML代码:

@foreach (var product in Model)
{
    <label>Amount</label>
    <div class="col-md-10">
        <input type="text" name="amounter" id="amounter" required />
    </div>
}

这是我的剧本:

<script type="text/javascript">

    $(".btn.btn-info.btn-lg-add").click(function(event)
    {
        event.preventDefault();
        var url;

        if ($("#amounter").val() == undefined || $("#amounter").val() == null) {
            url = '@Html.Raw(Url.Action("NoAmount", "Cart"))';
        }

        else {
            var url = '@Html.Raw(Url.Action("AddToCart", "Cart", new {idinput = "IDI",amount="AM"}))';
            url = url.replace("AM", $("#amounter").val());
            url = url.replace("IDI", $(this).data("id"));
        }

          window.location.href = url;
    });

</script>

注意,每个文本后面都有一个唯一的按钮。显然我有问题 id="amounter" 因为重复。所以这不是正确的代码。

所以我有多个文本(因为 foreach ),如何引用特定文本?

4 回复 | 直到 7 年前

Planet-Zoom 7 年前

如您所说,每个文本后面都有一个唯一的按钮。如果输入文本元素位于左侧,则可以找到如下内容:

$(".btn.btn-info.btn-lg-add").on('click', function(){
   text =  $(this).prev('input').val();
});

如果输入在后面,则可以找到如下内容:

$('.btn.btn-info.btn-lg-add').on('click', function(){
   text =  $(this).next('input').val();
});

Ruben Sala 7 年前

您可以添加一个数字,以便ID是唯一的

@{int i = 0;}
@foreach (var product in Model)
{
                        <label>Amount</label>
                        <div class="col-md-10">
                            <input type="text" name="amounter" id="amounter_@(i)" required />
                        </div>
                    </div>
                    i++;
}

bank balder 7 年前

你可以使用 $('input[name="amounter"]') 供参考

您可以通过console.log()检查该值;

当你想得到数据的时候

$.map($('input[name="amounter"]'),function(c){return c.value;});

Wara Haii 7 年前

嗨,伙计也许能帮你

$.each($("[name=amounter]"), function (index, data) {
                                     
 console.log($("[name=amounter]:eq("+index+")").val());
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label>Amount1</label>
<div class="col-md-10">
<input type="text" name="amounter" id="amounter_@1" required value="data1" />
</div>

<label>Amount2</label>
<div class="col-md-10">
<input type="text" name="amounter" id="amounter_@2" required value="data2" />
</div>


<label>Amount3</label>
<div class="col-md-10">
<input type="text" name="amounter" id="amounter_@3" required  value="data3"/>
</div>