1

我有以下结构中的 div 列表,其中的文本a.status-progress将显示“进行中”或“未开始”:

<div class="plan-section">
    <div class="tableView-row">
        <p class="plan-name">
            <a>some name</a>
         </p>
         <a class="status-progress">in progress</a>
     </div>
</div>
<!-- same structure as above but not expanded -->
<div class="plan-section"></div>
<div class="plan-section"></div>

每个标签中的所有<a>标签都<div>充当链接。我想做的是遍历每个 div,检查其中是否a.progress有字符串“in progress”。如果不是,我想删除cursor:pointercss 属性和附加到<a>标签的任何事件。当前我的 jQuery 实现是:

// remove linking if plan is not joined
$('.status-progress').each(function(i){
    var planLinks = $('.status-progress, .plan-name a');
    var planStatus = $(this).text();
    if (planStatus === "in progress"){
            planLinks.css('cursor','pointer')
        }
    });

虽然这不能正常工作,因为我相信我的逻辑each()是错误的,或者我需要稍后在代码块中添加另一个。谢谢您的帮助!

编辑:为状态进度添加了适当的类

4

1 回答 1

1

该行:

var planLinks = $('.status-progress, .plan-name a');

...将选择所有此类锚元素,而不仅仅是与.each()循环的当前迭代相关的元素。获得相关的一种方法是:

var planLinks = $(this).closest("div").find("a");

也就是说,使用 DOM 遍历方法找到包含的 div,然后选择其中的锚点。或者你可以基于兄弟姐妹等,但这更脆弱,因为对 html 结构的更改更有可能需要对 JS 进行更改。

.each()但是,如果您执行以下操作,则实际上并不需要循环:

$("a.status-progress:contains('in progress')")   // find the 'in progress' anchors
                .closest("div")                  // get their containing divs
                .find("a")                       // find the anchors in those divs
                .off()                           // remove the event handlers
                .css('cursor','pointer');        // set the CSS property
于 2013-06-04T14:17:03.697 回答