Question

当我点击特殊标签时，我希望获得两个标签的内容。当我点击标签a时，如何获得“Lorem产品”和“$ 23.00” <a class="btn" href="#">...</a>谢谢。

<div class="item">
    <!-- Item's image -->
   <img class="img-responsive" src="http://lorempixel.com/200/200/food/1/" alt="">
    <!-- Item details -->
    <div class="item-dtls">
        <!-- product title -->
        <h4><a href="#" >Lorem product</a></h4>
        <!-- price -->
        <span class="price lblue"  >$23.00</span>
    </div>
    <!-- add to cart btn -->
    <div class="ecom bg-lblue">
        <a class="btn" href="#" ">Add to cart</a>
    </div>
</div>

Answer 1

没有jQuery的简单回发示例：

样本模型

public class TestModel
{
    public string Name { get; set; }
    public int Price { get; set; }
}

示例控制器操作

public ActionResult IndexTest(TestModel model)
{
    var tmp = model;
    return RedirectToAction("Index");
}

您的观点已修订

@model WebApplication1.Models.TestModel

@using (Html.BeginForm("IndexTest", "Home"))
{
<div class="item">
    <!-- Item's image -->
    <img class="img-responsive" src="http://lorempixel.com/200/200/food/1/" alt="">
    <!-- Item details -->
    <div class="item-dtls">
        <!-- product title -->
        <h4><a href="#">@Html.EditorFor(m => m.Name)</a></h4>
        <!-- price -->
        <span class="price lblue">@Html.EditorFor(m => m.Price)</span>
    </div>
    <!-- add to cart btn -->
    <div class="ecom bg-lblue">
        <button class="btn" type="submit">Add to cart</button>
    </div>
</div>
}

如果您想要 anchor 而不是按钮，您可以在此锚点选择器上使用jQuery调用.submit()，并以相同方式POST到Controller。

jQuery .submit（）doc： https://api.jquery.com/submit/

另外，我建议阅读ASP.NET MVC的一些教程，因为这些是它工作原理的核心基础。

如果您想使用锚标记提交，请使用以下交换按钮：

<a href ="#" class="btn" onclick="$(this).closest('form').submit()">Add to cart</a>

将提交嵌套的表格我建议将其解压缩到<script>以获得更清晰的HTML代码。

Answer 2

.html()可用于获取任何元素的内容。试试如下：

$('a.btn').click(function () {
     var container = $(this).closest('.item');
     var title = container.find('.item-dtls > h4 > a').html();
     var price = container.find('.price').html();
     alert('Title: ' + title + ', Price: ' + price);
});

希望这会对你有所帮助。

如何在mvc中获取标签内容

2 个答案: