Question

修改

我正在对此进行编辑，因为看起来许多人正在关注html格式而不是问题。道歉

是的，当然div标签位于一个表中，是的，当然，一旦加载了DOM，就会调用jquery中标记的隐藏

Jquery如下;

$(document).ready(function() {

    //naturally there is more in this file but this is all that happens to this tag
   $("#assessmentStatusReason").children().hide();
}

HTML如下;

<table>

        <tr><td class="fieldLabelBold"><label>CRN:</label></td>
        <td class="fieldText" id="uxCRN"></td></tr>

        <tr><td class="fieldLabelBold">
                <label>
                    Jobseeker Id:</label>
            </td>
            <td class="fieldText" id="uxJobseekerId">
            </td>
        </tr>
        <tr>
            <td class="fieldLabelBold">
                <label>
                    Name:</label>
            </td>
            <td class="fieldText" id="uxName">
            </td>
        </tr>
        <tr>
            <td class="fieldLabelBold">
                <label>
                    Date Of Birth:</label>
            </td>
            <td class="fieldText" id="uxDateOfBirth">
            </td>
        </tr>
        <tr>
            <td class="fieldLabelBold">
                <label>
                    Gender:</label>
            </td>
            <td class="fieldText" id="uxGender">
            </td>
        </tr>
        <tr>
            <td class="fieldLabelBold">
                <label>
                    Phone:</label>
            </td>
            <td class="fieldText" id="uxPhone">
            </td>
        </tr>
        <tr>
            <td class="fieldLabelBold">
                <label>
                    Mobile:</label>
            </td>
            <td class="fieldText" id="uxMobile">
            </td>
        </tr>

        <div>
        <h3>Addresses</h3>
        </div>

        <tr>
            <td class="fieldLabelBold">
                <label>
                    Residential Address:</label>
            </td>
            <td class="fieldText" id="uxResidentialAddress">
            </td>
        </tr>
        <tr>
            <td class="fieldLabelBold">
                <label>
                    Postal Address:</label>
            </td>
            <td class="fieldText" id="uxPostalAddress">
            </td>
        </tr>
        <tr>
            <td class="fieldLabelBold">
                <label>
                    Interpreter Required:</label>
            </td>
            <td class="fieldText" id="uxInterpreterRequired">
            </td>
        </tr>
        <tr>
            <td class="fieldLabelBold">
                <label>
                    Language:</label>
            </td>
            <td class="fieldText" id="uxLanguage">
            </td>
        </tr>

        <tr>
            <td class="fieldLabelBold ">
                <label>
                    Assessment Status:</label>
            </td>
            <td width="300px">                
                !{Html.DropDownList("assessmentDecision", Model.ReferralStatus, new { id = "uxassessmentDecision" })}
            </td>
        </tr>
        <div id="assessmentStatusReason">
        <tr id="uxNoShowDate">
            <td class="fieldLabelBold"><label>No Show Date:</label></td>
            <td>!{Html.DatePicker("uxNoShowDate", null, true, "100px")}</td>
        </tr>        

        <tr id="uxReferralDeclinedReasonCode" >
            <td class="fieldLabelBold"><label>Declined Reason:</label></td>
            <td>!{Html.DropDownList("DeclinedReason", Model.ReferralDeclinedReasonCode, new { id = "uxDeclineReasonCode" })}</td>
        </tr>       
        </div>
        </table>

您好，

这是基本的，我已经在这类问题上看过其他帖子，但答案很奇怪，似乎不起作用。

我有一个div标签

<div id="assessmentStatusReason">
        <tr>
            <td class="fieldLabelBold"><label>Reason:</label></td>
            <td class="fieldText" id="uxLanguage"><input id="reasonInput2" /></td>
        </tr>
        </div>

并加载我运行的jquery

$("#assessmentStatusReason").children().hide();

但是在加载时仍然可以看到tr td和输入

任何想法？

Answer 1

它对我有用。问题是你需要等到HTML加载。这是一个功能齐全的例子：

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<body>
<pre>
<script>
    $(document).ready(function() {
        $("#assessmentStatusReason").children().hide();
    })

</script>
</pre>
<div id="assessmentStatusReason">
        <tr>
            <td class="fieldLabelBold"><label>Reason:</label></td>
            <td class="fieldText" id="uxLanguage"><input id="reasonInput2" /></td>
        </tr>
</div>

Answer 2

你需要div，不是那个糟糕的标记吗？

你可以很容易地隐藏tr，如果你隐藏tr（或div）内容不会显示，那么为什么要试图隐藏孩子？

<tr id="assessmentStatusReason">
  <td>...</td>
  <td>...</td>
</tr>

$(document).ready(function() {
    $("#assessmentStatusReason").hide();
})

Answer 3

我建议您将assessmentStatusReason作为一个类而不是ID，这样您就可以隐藏多行。

<tr class="assessmentStatusReason">
 <td class="fieldLabelBold"><label>Reason:</label></td>
 <td class="fieldText"><input id="reasonInput1" /></td>
</tr>
<tr class="assessmentStatusReason">
 <td class="fieldLabelBold"><label>Reason:</label></td>
 <td class="fieldText"><input id="reasonInput2" /></td>
</tr>

然后使用此脚本：

$(document).ready(function() {
    $(".assessmentStatusReason").hide();
});

Answer 4

将“assessmentStatusReason”id提供给tr标签。或者，如果您想要隐藏多个tr，请将其设为类并调用$（'。assessmentStatusReason'）。hide（）。

Answer 5

尝试一下，看看它是否有所作为：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>

</head>
<body>
    <div id="assessmentStatusReason">
        <table>
            <tr>
                <td class="fieldLabelBold">
                    <label>
                        Reason:</label>
                </td>
                <td class="fieldText" id="uxLanguage">
                    <input id="reasonInput2" />
                </td>
            </tr>
        </table>
    </div>
</body>

<script type="text/javascript">
    $(document).ready(function() {
        $("#assessmentStatusReason").children().hide();
    });  
</script>

</html>

我注意到div没有围绕<table></table>类型设置。这可能会有所不同。

使用jQuery隐藏div标签中的tr标签

修改

5 个答案: