找到最接近的跨度id来替换跨度内容

我可以证明这一点很复杂，所以如果我要去掉一个兔子洞，请阻止我。我试图在单击复选框时获取跨度的id，然后更改该跨度中的内容。找到最接近的跨度id来替换跨度内容

我已经尝试了一些东西，我认为我走在了正确的轨道上，但正如我所说的，我倾向于将这些事情复杂化。顺便说一下，所有的ID都是不同的，并由数据库ID号设置。

我已经试过这

var readInput = $(".check span").attr('id'); 
$('#'.readInput).text('Read');

哪一种类型的作品的。除了只抓取第一个ID，即使我点击第三或第四个复选框....也不会改变文本。

我也试过只是抓住跨度，然后用这种方式进行编号，但那不是我所需要的。

任何帮助将是美好的！

整个功能看起来像这样......虽然这个问题很多都没有必要。

$('.memo input.checkIt').on("click", function(){ 
    var name_attr = $(this).attr('name'); 
    var hidden_input = $('input[name="' + name_attr + '"]'); 

    if($(this).siblings('a').attr("class") == 'checked') { 
    hidden_input.val(0); 
    }else { 
    hidden_input.val(1); 
    $(this).attr('disabled','disabled').parent().addClass('disabled'); 

    var readInput = $(".check span").attr('id'); 
    $('#' + readInput).text('Read'); 

    console.log(readInput); 
    } 
});

，这是HTML

<p class="pull-right check"> 
@if($cover_design_note->is_read) 
    {{ date('m/d/Y g:i a', strtotime($cover_design_note->date)) }}&nbsp;&nbsp;<i class="icon-thumbs-up program_this"></i> &nbsp; Read 
    @else 
    <input type="checkbox" class="checkIt" name="{{ $cover_design_note->id }}" /><span id="messRead{{ $cover_design_note->id }}"> Unread</span> 
    @endif 
</p>

来源

2013-08-22 zazvorniki

你能发布整个事件处理程序和标记吗？ –

忽略此评论 – tmcc

试试这个：

$(this).closest(".check").find("span").text('Read');

在单击处理this是点击的元素，然后.closest(".check")为您提供了元素的包含"check"段落，然后从那里你可以找到跨度。

根本不需要使用元素的ID，因为尽管您可以在检索时检索该ID，但您必须已经有对正确元素的引用，以便您可以直接设置它的.text()。

来源

2013-08-22 22:47:48 nnnnnn

是的，非常感谢。我原本试图做这样的事情，但后来决定再次使事情复杂化...... – zazvorniki

在javascript中的连接用一个+完成：

你的选择应该是：

$('#' + readInput).text('Read');

这可能是更容易移动到span标记的html中的类，例如：

HTML

<div class="memo"> 
<p class="pull-right check"> 
&nbsp;&nbsp;<i class="icon-thumbs-up program_this"></i> &nbsp; 
    <input type="checkbox" class="checkIt"/> 
    <span id="somethingDynamic" class="messRead"> Unread</span> 
</p> 
</div>

这真的归结的JavaScript：

$('.memo input.checkIt').on("click", function(){ 
    //omitted other parts of code 
    $('.messRead', $(this).parent()).text('Read'); 
});

的Javascript

$('.memo input.checkIt').on("click", function(){ 
    $('.messRead', $(this).parent()).text('Read'); 
});

的jsfiddle：http://jsfiddle.net/BYU3w/

来源

2013-08-22 22:38:34

谢谢，我习惯于使用php连接！尽管如此，我仍然无法获得ID ... – zazvorniki

发布事件处理程序和标记 –

找到最接近的跨度id来替换跨度内容

回答

相关问题