試圖預覽表單輸入jQuery

Question

我試圖在我的表單中預覽我的名字和步驟元素，因此用戶可以看到他們是否犯了一個錯誤。我能夠預覽該步驟，但名稱不起作用。任何人都能看到爲什麼

http://jsfiddle.net/pocockn/rw54b/

$(document).ready(function() { 
    var commentNode = $('#lp-step'), 
     nameNode = $('#lp-name'), 
     name = $('#name'); 



    $('#live-preview-form input, #live-preview-form textarea').bind('blur keyup',function() { 



     commentNode.text($('#step_1').val()); 
     commentNode.html($('#lp-step').html().replace(/\n/g,'<br />')); 

    if($('#name').val()) { 
     nameNode.text(name.val() + ' says:'); 

    } 
    else { 
     return false; 
    } 


    }); 
}); 

Answer 1

你不能有相同的ID兩個元素，如果你這樣做只會選擇它找到的第一個元素。 （在這種情況下，它的div永遠是空的，永遠不會運行你的if語句）。您有div與id=name和您的input。所以我改爲將您的div ID更改爲nameDiv。

Id's should be unique to avoid confusion.

<div id="nameDiv"> 
    <label for="name">Enter recipe name:</label> 
    <input type="text" id="name" name="name"> 
    <br /> 
</div> 

http://jsfiddle.net/trevordowdle/rw54b/1/