Fatal编程技术网
  • jquery/
  • Jquery 如果按钮上的数据不存在，则禁用该按钮。这应该发生在文档准备就绪时

Jquery 如果按钮上的数据不存在，则禁用该按钮。这应该发生在文档准备就绪时

jquery html

Jquery 如果按钮上的数据不存在，则禁用该按钮。这应该发生在文档准备就绪时,jquery,html,Jquery,Html,我有一个简单的问题，我试图在页面加载时禁用jQuery按钮 <body> <div id="inDetialContainer" style="display:none;"> <div id="detailText">Detailed Information</div> <button id="overviewDiv" class="nesteIndtText" href="#" onCl

我有一个简单的问题，我试图在页面加载时禁用jQuery按钮

<body>    
    <div id="inDetialContainer" style="display:none;">
       <div id="detailText">Detailed Information</div> 
         <button id="overviewDiv" class="nesteIndtText" href="#"   onClick="loadInnerOfChildPage(1);">Overview</button>    // this button should be disabled when data does not exist  
         <button id="proceduresDiv" class="nesteIndtText" href="#" onClick="loadInnerOfChildPage(2);">Procedures</button> // this button should be disabled when data does not exist  
         <button id="equipmentDiv" class="nesteIndtText" href="#" onClick="loadInnerOfChildPage(3);">Equipment</button>   // this button should be disabled when data does not exist  
         <button id="backgroundDiv" class="nesteIndtText" href="#" onClick="loadInnerOfChildPage(4);">Background</button>  // this button should be disabled when data does not exist  
         <button id="safetyDiv" class="nesteIndtText" href="#" onClick="loadInnerOfChildPage(5);">Safety</button>   // this button should be disabled when data does not exist  
         <button id="examQuestionsDiv" class="nesteIndtText" href="#" onClick="loadInnerOfChildPage(6);">Exam Questions</button>    // this button should be disabled when data does not exist  
   </div>         
    <div id="subContent3" style="display:none;">    
      <div id="normalTextHeader">Equipment Details</div>
          <p class="noData">Content not available.</p>
    </div>
      <script>

      $(document).ready(function()
        {
          parent.parent.loadInnerOfChildPage = loadInner; 
         function loadInner(arg)
        {

        var flag = false;
            var parentId;
        flag = ( $("#subContent"+arg).children('p').hasClass('noData'));

            if(flag == false)
            {
              $("#subContent"+arg).css("display","block");  
              $("#subContent"+arg).siblings(this).css("display","none");
              $("#backToNav").css("display","block");   
              }
             else
              {
             parent.parent.$("#inDetialContainer button #").parent().attr("disabled","disabled"); 
             $("#subContent"+arg).css("display","none");
             $("#subContent"+arg).siblings(this).css("display","none");
             $("#backToNav").css("display","none"); 
                }
             }  
     });
   </script>


详细资料
概述//当数据不存在时，应禁用此按钮
过程//当数据不存在时，应禁用此按钮
设备//当数据不存在时，应禁用此按钮
背景//当数据不存在时，应禁用此按钮
安全//当数据不存在时，应禁用此按钮
考试问题//当数据不存在时，应禁用此按钮
设备详情
内容不可用

$（文档）.ready（函数（）
{
parent.parent.loadInnerOfChildPage=loadInner；
函数装入内部（arg）
{
var标志=假；
var-parentId；
flag=（$（“#subcent”+arg）.children（'p'）.hasClass（'noData'））；
如果（标志==false）
{
$（“#subcent”+arg）.css（“显示”、“块”）；
$（“#subcent”+arg）.this.css（“display”，“none”）；
$（“#backToNav”）.css（“显示”、“块”）；
}
其他的
{
parent.parent.$（“#索引容器按钮“#”）.parent（）.attr（“禁用”、“禁用”）；
$（“#分包”+arg）.css（“显示”、“无”）；
$（“#subcent”+arg）.this.css（“display”，“none”）；
$（“#backToNav”）.css（“显示”、“无”）；
}
}  
});

加载页面时，如果数据不存在，则应在“文档准备就绪”上禁用单击。有人能解释一下这是怎么可能的吗

谢谢

所有具有
p
子级且具有
noData
类的按钮都可以单击，而那些没有单击的按钮将被禁用，对吗

$(document).ready(function() {
  $(".nesteIndtText").filter(function() {
    return $(this).children("p.noData").length == 0;
  }).prop("disabled", true);

  $(".nesteIndtText").click(function() {
    // do something when a clickable button is clicked
  });
});
上面使用的
.filter（）
函数将返回其子项中没有
p.noData
的按钮，然后使用
.prop（）
禁用这些按钮

我看到，当单击按钮时，您正在传递一个参数，这可能是您使用
onClick
属性的原因。这可以通过以下方式实现：

<button id="overviewDiv" class="nesteIndtText" href="#" data-arg="1">Overview</button>
<button id="proceduresDiv" class="nesteIndtText" href="#" data-arg="2">Procedures</button>

概述
程序
如您所见，我添加了一个新属性，
data arg
。单击按钮时，可以使用
click
处理程序中的
$（this）.attr（“data arg”）
获取该值。

那么那些onclick函数会执行一些ajax请求吗？如果您运行一些服务器端语言，这将更加高效，因为您可以看到哪些有子数据，然后禁用它们，在加载时执行此操作的唯一方法是发出大量ajax请求，查看哪些有数据，然后在没有返回数据时禁用按钮。您使用的是jQuery，那么，为什么不删除每个按钮的
onClick
属性，并在javascript中为它们添加一个事件侦听器呢；当没有数据时。。否则，请启用按钮。所有带有一个具有noData类的p子级的按钮都不可单击，而那些没有noData类的按钮都可单击。@Chandni哦，我是用另一种方法得到的。只需将
.filter（）
函数更改为
return$（this）.children（“p.noData”）.length>0
，该函数返回带有
p.noData
子级的按钮，然后禁用它们：）