Question

我有一个GridView控件嵌入div中，如

<div id="parentDiv">
        Hello how r u
        <p>
            <asp:GridView ID="grdView" runat="server">
            </asp:GridView>
        </p>
    </div>

我想要实现的是，找到网格的父元素（这是“parentDiv”）并将背景颜色设置为绿色。我的代码（不起作用）

$(document).ready(function() {
    var parentElement = $('#grdView').parent("div");
    parentElement.css("background-color", "#ffaaaa");
});

Answer 1

相对于GridView，您最好使用closest()方法：

var parentElement = $("#grdView").closest("#parentDiv");  // or $("#parentDiv")

它将比div更好地获得相应的parent()，因为GridView的父节点是p元素。

更新。为了仅为文字设置背景，您必须将其放在个人span或div标记中：

<div id="parentDiv">
    <span>Hello how r u</span>
    <p>
        <asp:GridView ID="grdView" runat="server">
        </asp:GridView>
    </p>
</div>

然后使用以下JavaScript代码：

var parentElement = $("#grdView").closest("#parentDiv").children("span");
         // or just $("#parentDiv").children("span");

Answer 2

由于grdView的父级是p元素，因此您可以更改

 var parentElement = $('#grdView').closest("div");

进一步参考：http://api.jquery.com/closest/

在这里也使用camelCase表示法：

 .css("backgroundColor", "#ffaaaa");

如果您只需要为即时文本节点提供绿色背景，只需覆盖p元素上的背景颜色

$('#parentDiv > p').css("backgroundColor", "<other color here>");

Answer 3

我的代码（不起作用） - ，因为如果你写runat="server" id而不是gridview，请查看源代码中的id，我认为它将是ContentPlaceHolder1_grdView或类似的东西< / p>

$(document).ready(function () {           

            var parentElement = $('#grdView').parent("div");
            parentElement.css("background-color", "#ffaaaa");


        });

Answer 4

为了给出包含元素着色而不影响网格的错觉，您需要为网格着色与背景相同的颜色。

$("#grdView").css("backgroundColor",$("body").css("backgroundColor"));
$("#grdView").closest("div").css("backgroundColor","#ffaaaa");

无法使用JQuery中的Parent方法正确找到父ID

4 个答案: