Question

我还是JQuery的新手，但我想做的是：

点击我的编辑按钮并调用someFunction（）
然后Jquery将隐藏我的编辑按钮，显示我的保存按钮，并隐藏删除按钮。
获取item.ID并保存为var以供日后使用。

到目前为止，这是我的尝试。

按钮设置：

<td class="col-lg-3 col-lg-offset-1">
         <span style="visibility:hidden">@Html.DisplayFor(modelItem => item.ID)</span>

         <span class="item-edit-button">
         <button type="button" onclick="someFunction()" class=" btn btn-warning col-lg-4"><span style="margin-right: 5px" class="glyphicon glyphicon-pencil"></span>Edit</button>
         </span>

         <span class="item-save-button">
         <button type="button" class="btn btn-success col-lg-4"><span style="margin-right: 5px" class="glyphicon glyphicon-trash"></span>Save</button>
         </span>

         <span class="item-delete-button">
         <button type="button" class="btn btn-danger col-lg-4" onclick="location.href='@Url.Action("Delete", "Movie", new { id = item.ID })' ;return false;"><span style="margin-right: 5px" class="glyphicon glyphicon-trash"></span>Delete</button>
         </span>
</td>

我的JQuery尝试（没有得到var，因为我还没到达那一点）

<script>
    function someFunction() {
          someFunction //trying to get current item/value/button/ect..
                .hide()
                .next("span.item-save-button")
                .show()
                .next("span.item-delete-button")
                .hide()
    };
</script>

编辑：如何使用下面的答案

function someFunction(element) {
        $(element).hide();
        $(element).closest("td").find("span.item-save-button").show();
        $(element).closest("td").find("span.item-delete-button").hide();
    }

Answer 1

你需要像这样传递元素引用：

<button type="button" onclick="someFunction(this)">Click ME</button>

并且在功能中：

function someFunction(element) {

                $(element).hide();
                $(element).closest("td").find("span.item-save-button").show();
                $(element).show();
                $(element).closest("td").find("span.item-delete-button").hide();
                $(element).hide();
    }

按钮onClick以激活JQuery功能

1 个答案: