开发者

jQuery regex selector

开发者 https://www.devze.com 2023-02-10 20:52 出处:网络
Here is my code: <script language=\"javascript\" type=\"text/javascript\"> $(document).ready(function(){

Here is my code:


<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="&开发者_StackOverflowlt;?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>

I want hide item_1_1 and item_1_2 when i click on item_1, I don't know how can i do that with regex.

I use http://james.padolsey.com/javascript/regex-selector-for-jquery/ for regx


No need for the regex selector here. Use jQuery's built-in attribute-starts-with selector:

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

If you just want to use that plugin anyway, then your selector would be:

':regex(id, ^item_1)'


no need regex

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

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

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

    });

    });
    </script>


You could do it with your naming schema or you could just simply...

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

Hide the div siblings of the clicked link within the div, especially if you're building this as a tree structure... See the fiddle example. This would actually apply to all links inside divs that are children of other divs, so you could restrict this by performing a $("div.tree").find("div > div") selection and binding the event to that set to make children divs behave the same.

Alternatively, if you just want to see something fun that may be along the lines of what you're attempting to do, here's a fiddle I made while messing around with tree style navigation. It might lead you to consider other approaches, especially since I'm not sure your code has taken into consideration the matter of displaying those divs again in the event that wasn't what the user really wanted.

0

精彩评论

暂无评论...
验证码 换一张
取 消