Question

我需要在s span元素

之后动态添加ul元素

<div class="class1">
<input class="required" type="checkbox" name="id1" id="id1" title="Required"/>
    <span class="class2">
        <label>&nbsp;&nbsp;Some text.......</label>
    </span>                   
</div>

我尝试了下面的js代码，但它没有来......有人可以帮我这个

$('#submitBtn').click(function(){
$('.required').filter(':visible').each(function () {
    var input = $(this);
    input.nextAll("ul.error").remove();
    if(!$(this).is(':checked')){
       $('<ul class="error"><li>Required</li></ul>').insertAfter(input.nextAll(".class2"));
    }
});
});

我希望将新的ul元素放在span下面，但是

由于

Answer 1

在“if”：

中使用此语句

$('.class2').after('<ul class="error"><li>Required</li></ul>');

Answer 2

我试过这段代码看起来不错：

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <title>test</title>
    <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
    <script>
    $(function(){
        $('#submitBtn').click(function(){

            var error = false;

            $('.required').filter(':visible').each(function () {

                var input = $(this);
                input.nextAll("ul.error").remove();

                if( ! $(this).is(':checked')){
                   $('<ul class="error"><li>Required</li></ul>').insertAfter(input.nextAll(".class2"));

                   error = true;
                }

            });

            if(error)
                return false;

        });
    });
    </script>
</head>
<body>
    <form>
        <div class="class1">
            <input class="required" type="checkbox" name="id1" id="id1" title="Required"/>
            <span class="class2">
                <label>&nbsp;&nbsp;Some text.......</label>
            </span>                   
        </div>
        <input type="submit" id="submitBtn" value="send"/>
    </form>
</body>
</html>

Answer 3

尝试这样的事情

                $('.required').filter(':visible').each(function () {
                    var input = $(this);
                    input.nextAll("ul.error").remove();
                    if(!this.checked){
                       $(this).next().after($('<ul class="error"><li>Required</li></ul>'));
                       $('<ul class="error"><li>Required</li></ul>').insertAfter(input.nextAll(".class2"));
                    }
                });

在span元素jquery之后动态添加ul

3 个答案: