如何根据ID值在页面加载中加载div

问题描述 投票:0回答:1

我在JQuery面板上使用SlideUp slideDownshow/hide方法。如何默认加载或显示第一条记录的联系信息?

现在,由于我设置了面板display:none,它加载为空白:<div class="panel rpspanel panel-default" id="@item.ID" style="display: none">否则,如果我有多个结果,它将全部加载。

需要帮助来在页面加载时加载第一个。其余的点击事件均能完美运行。

左面板:

将项目ID(或任何唯一值)传递到li属性中的data-id上>

<ul id="treeview">
     @foreach (var item in rpInfo)
        {
          <li data-expanded="true" class="panel-handler" data-id="@item.id">
              <i class="fa fa-check-circle"></i>@item.PartyName
                <ul>
                     <li data-expanded="true">  <i class="fas fa-check-circle"></i> @item.ContactName </li>
                 </ul>
           </li>
         }
  </ul>  

右面板:

id attribute所有面板。 我在左面板中通过的相同id

  @foreach (var item in rpInfo)
            {                    
                var DeleteModal = "#myModal" + item.ID;                   
                var mid = "myModal" + item.ID;
                <div class="panel rpspanel panel-default" id="@item.ID" style="display: none">
                              Contact Information</h4>
                          </div>
                          <div class="panel-body">
                              <div class="card card-understated">
                                  <div class="card-heading">
                                      <h4>@(Localizer["Contact Preview "])</h4>
                                  </div>
                                  <div class="card-body">
                                      <p>
                                          @item.ContactName<br>
                                          @item.ContactTitle<br>
                                          @item.PartyName<br>
                                          @item.AddressLine1<br />
                                          @item.City, @item.State @item.Country
                                      </p>
                                  </div>
                              </div>                          
                          </div>
                      </div>
                  }

jQuery脚本:

li click左侧面板上的[获得data-id属性值。隐藏所有面板。显示具有指定id属性的面板。


    $(document).ready(function() {
        $(".panel-handler").click(function() {
            let id = $(this).data("id");
            $(".rpspanel").slideUp();
            $("#" +id).slideDown();
        });
    });




我正在使用JQuery SlideUp和slideDown方法显示/隐藏面板。如何默认加载或显示第一条记录的联系信息?现在它加载为空白,因为我设置了面板...

javascript jquery html css
1个回答
0
投票

基于functionslideDown()功能单独创建id,并在加载文档时传递第一个id.panel-handler

热门问题
推荐问题
最新问题