输入中的“未定义”值(jQuery)

时间:2011-08-28 10:37:31

标签: jquery

请帮忙,为什么不显示输入数据Undefined

jsFiddle

HTML:

    <div id="au">
        <div id="allow">  
        <p class="tf">Allow From:</p><br>

        <center><button id="aadd1">+</button><br></center>  
        </div><br>            
        <div id="deny">  
        <p class="tf">Deny From:</p><br>

        <center><button id="aadd2">+</button><br></center>
        </div>
    </div>
 <center><button id="go">gogogo</button></center>

 <span id="x"></span>

JavaScript的:

$(document).ready(function(){
    var a1 = 0;
    var a2 = 0;

    $("#aadd1").click(function(){
        $("#allow").append('<input class="lf" id="a-'+(++a1)+'" type="text"><br><br>');
    });
    $("#aadd2").click(function(){
        $("#deny").append('<input class="lf" id="a-'+(++a2)+'" type="text"><br><br>');
    });

    var al="";
    var den="";
    var ad="";


    $('#allow input').bind('blur keyup',function() {
        $(this).data('allow', "Allow from " + $(this).val() + "<br>");
       });
    $('#deny input').bind('blur keyup',function() {
        $(this).data('deny', "Deny from " + $(this).val() + "<br>");
       });


$('#go').click(function(){
        $("#allow input").each(function(){
            if($(this).val()){
                al += $(this).data('allow') + "\n" || '';
            }
          });
        $("#deny input").each(function(){
            if($(this).val()){
                den += $(this).data('deny') + "\n" || '';
            }
          });
    ad = "Order deny,allow <br>" + al + den;
    $("#x").html(ad);
});
});

2 个答案:

答案 0 :(得分:3)

由于您动态创建输入字段.bind()将不适用于将来的元素。将.bind()更改为使用.live(),它似乎正常工作。

$('#allow input').live('blur keyup', function() {
    $(this).data('allow', "Allow from " + $(this).val() + "<br>");
});
$('#deny input').live('blur keyup', function() {
    $(this).data('deny', "Deny from " + $(this).val() + "<br>");
});

答案 1 :(得分:0)

你也可以使用.delegate(),你可以在这里阅读

http://api.jquery.com/delegate/