如何检查按钮应用的样式不起作用答案

【问题标题】：How to check what style a button has applied to it NOT WORKING如何检查按钮应用的样式不起作用
【发布时间】：2017-04-28 07:12:00
【问题描述】：

在开发者工具中我可以看到我的按钮：

<input type="submit" name="ctl00$MainContent$MapUserControl$MapDefPage$CreateEditLayerPage$addAttribute" value="Add Attribute" id="ctl00_MainContent_MapUserControl_MapDefPage_CreateEditLayerPage_addAttribute" title="Click to add a new attribute to the layer" class="edit green btn spaceRight" style="float: right; display: block;">

你可以看到样式最后有一个 BLOCK 的 DISPLAY。

但是当我尝试在控制台中测试时：

$('addAttribute').css("display") == "block"
false

当我看到它应该是 TRUE 时，我得到了 FALSE 的回报。为什么是这样？基本上我想检查我的按钮是隐藏还是可见，以便我可以根据哪个执行任务。也试过了

$('addAttribute').is(":visible"); 
false

但也返回 false。我究竟做错了什么？谢谢

【问题讨论】：

addAtribute 不是 id，也不是您输入中的类或其他。这正常吗？
你的选择器是什么？没有对象<addAttribute />，选择类使用.class，id - #id

标签： javascript jquery css styles block

【解决方案1】：

我认为，您使用了错误的选择器。你正在使用像

$('addAttribute').css("display") == "block"

但是没有像addAttribute 这样的标签。你可以检查一下

$('.edit.green.btn.spaceRight').css("display") == "block"

您也可以检查您输入的 id

【讨论】：

【解决方案2】：

alert($(':input.btn').css("display") == "block")

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="submit" name="ctl00$MainContent$MapUserControl$MapDefPage$CreateEditLayerPage$addAttribute" value="Add Attribute" id="ctl00_MainContent_MapUserControl_MapDefPage_CreateEditLayerPage_addAttribute" title="Click to add a new attribute to the layer" class="edit green btn spaceRight" style="float: right; display: block;">

使用:input选择器选择带类的输入更准确

【讨论】：

@rushil on OP 没有提到这些事情，但如果他愿意，他可以添加课程。
现在ans在您编辑后更可取...添加一个属性 .btn 可能会起作用

【解决方案3】：

if($('.edit.green.btn.spaceRight').css("display") == "block"){
  alert('yes');
}else{
  alert('no');
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<input type="submit" name="ctl00$MainContent$MapUserControl$MapDefPage$CreateEditLayerPage$addAttribute" value="Add Attribute" id="ctl00_MainContent_MapUserControl_MapDefPage_CreateEditLayerPage_addAttribute" title="Click to add a new attribute to the layer" class="edit green btn spaceRight" style="float: right; display: block;">

【讨论】：

【解决方案4】：

您可以尝试根据input元素查找，如下id，

在您当前的代码中，您引用的选择器 addAttribute 不正确。

if ($('input#ctl00_MainContent_MapUserControl_MapDefPage_CreateEditLayerPage_addAttribute').css("display") == "block") {
  alert("Detected");
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<input type="submit" name="ctl00$MainContent$MapUserControl$MapDefPage$CreateEditLayerPage$addAttribute" value="Add Attribute" id="ctl00_MainContent_MapUserControl_MapDefPage_CreateEditLayerPage_addAttribute" title="Click to add a new attribute to the layer"
class="edit green btn spaceRight" style="float: right; display: block;">

【讨论】：