Question

这是我的代码：


<script language="javascript" type="text/javascript">
    $(document).ready(function(){
        $('.tree div').click(function(){
            var id = $(this).attr('id');
            $('.tree div:regex(id,^['+id+'_])').html('this one');
        });
    });
</script>

<div class="tree">
    <div id="item_1">
        <a href="<?php echo $this->url(array('action' => 'ketab')); ?>"><?php echo $this->translate("Add Ketab"); ?></a>
    </div>
    <div id="item_1_1">
        <span></span>
        <a href="<?php echo $this->url(array('action' => 'ketab')); ?>"><?php echo $this->translate("Add Ketab"); ?></a>
    </div>
    <div id="item_1_2">
        <span></span>
        <a href="<?php echo $this->url(array('action' => 'ketab')); ?>"><?php echo $this->translate("Add Ketab"); ?></a>
    </div>
</div>

当我点击item_1_1时，我想要隐藏item_1_2和item_1，我不知道如何使用正则表达式执行此操作。

我将http://james.padolsey.com/javascript/regex-selector-for-jquery/用于regx

Answer 1

这里不需要正则表达式选择器。使用jQuery的内置attribute-starts-with selector：

$('#item_1').click(function () {
    $('[id^="item_1"]').hide();
});

如果您只是想使用该插件，那么您的选择器将是：

':regex(id, ^item_1)'

Answer 2

不需要正则表达式

 <script type="text/javascript">
    $(document).ready(function() {

    $('.tree div').click(function(){

    $('.tree div').hide();
    $(this).show()

    });

    });
    </script>

Answer 3

您可以使用命名架构来完成，或者只是简单地......

$("div > div a").click(function() {
    $(this).parent().siblings("div").hide();
});

隐藏div中单击链接的div兄弟，特别是如果您将其构建为树结构... See the fiddle example。这实际上适用于作为其他div的子节点的div内的所有链接，因此您可以通过执行$（“div.tree”）。find（“div＆gt; div”）选择并将事件绑定到该集合来限制此操作。让孩子们的行为一样。

或者，如果你只想看到一些有趣的东西，可能与你试图做的事情有关，here's a fiddle I made同时搞乱了树型导航。它可能会引导您考虑其他方法，特别是因为我不确定您的代码是否考虑了在用户真正想要的情况下再次显示这些div的问题。

jQuery正则表达式选择器

3 个答案: