使用jquery添加和删除菜单

时间:2015-07-04 02:57:58

标签: javascript php jquery

好吧,我只用一个按钮尝试多个菜单,但似乎jquery的代码仍然错误或丢失了一些重要的东西。

这里是代码:

小部件:

<div class="wizard">
    <div class="widget widget-tabs widget-tabs-gray">
        <!-- Widget heading -->
        <div class="widget-head">
            <ul>
                <li class="active"><a href="#tab1-1" data-toggle="tab"><i></i>Data Siswa</a></li>
                <li><a href="#tab2-1" data-toggle="tab"><i></i>Data Kerabat</a></li>
                <li><a href="#tab3-1" data-toggle="tab"><i></i>Data Keluarga</a></li>
                <li><a href="#tab5-1" data-toggle="tab"><i></i>Save</a></li>
            </ul>
        </div>

内部小部件:

 <div class="row-fluid row-merge">
        <form action="student_post.php" method="post" name="noform">
        <div class="widget-body">
            <div class="tab-content">
                <?php
                    //$string1=sprintf("%04d", $id); for display to the  0001 0010 0100 etc..
                ?>

小部件的列菜单:

<div class="tab-pane" id="tab2-1">
                    <div class="span6">
                        <div class="innerAll">  
                            <input type="radio" id="dkerabat" name="radiokerabat" class="margin0" value="1" /><label class="padleft5">Ada Kerabat</label>
                            <input type="radio" id="ekerabat" name="radiokerabat" class="margin0" checked="checked" value="0" /><label class="padleft5">Tidak Ada</label>
                            <div class="separator bottom"></div>

                            <label class="strong">Bekerja</label>
                            <input type="radio" name="kerja" id="kerja1" value="TETAP" class="margin0" disabled="disabled" /><label class="padleft5">Tetap</label>
                            <input type="radio" name="kerja" id="kerja2" value="CALON TETAP" class="margin0" disabled="disabled" /><label class="padleft5">Calon Tetap</label>
                            <br />
                            <input type="radio" name="kerja" id="kerja3" value="HONORER" class="margin0" disabled="disabled" /><label class="padleft5">Honorer</label>
                            <input type="radio" name="kerja" id="kerja4" value="KONTRAK" class="margin0" disabled="disabled" /><label class="padleft5">Kontrak</label>
                            <div class="separator bottom"></div>

按钮:

<a class="btn btn-primary btn-icon glyphicons circle_plus" href ="#"><i></i> Tambah</a>

现在我正在使用这样的jquery(只是一个例子):

jQuery(document).ready(function($){
$('.my-form .add-box').click(function(){
    var n = $('.text-box').length + 1;
    if( 5 < n ) {
        alert('Stop it!');
        return false;
    }
    var box_html = $('<p class="text-box"><label for="box' + n + '">Box <span class="box-number">' + n + '</span></label> <input type="text" name="boxes[]" value="" id="box' + n + '" /> <a href="#" class="remove-box">Remove</a></p>');
    box_html.hide();
    $('.my-form p.text-box:last').after(box_html);
    box_html.fadeIn('slow');
    return false;
});

继续:

$('.my-form').on('click', '.remove-box', function(){
    $(this).parent().css( 'background-color', '#FF6C6C' );
    $(this).parent().fadeOut("slow", function() {
        $(this).remove();
        $('.box-number').each(function(index){
            $(this).text( index + 1 );
        });
    });
    return false;
});

});

这里是链接http://i.imgur.com/FK1aBaJ.png

全部。所以我必须使用它,但它对菜单来说太长了,我应该使用$ GET还是其他?感谢。

0 个答案:

没有答案