2012-04-18 21 views
1

在此表單中,我有一個用戶消息<span>。它會忽略HTML和CSS樣式表中給出的樣式信息。另外,如果我更新使用.html()新文本不顯示。跨度忽略樣式信息和.html()更新

$('#matting').append('<div id="register_user_box" class="inline_form" style="position: absolute; top: 20px; right: 10px; <br/><span id="user_msg" style="width: 90%; height: 15px; color: red; font-family: Arial; font-size: 11px;">Info msg</span><br/><form id="register_user_id" name="register_user_form"> <button id="cancel" onclick="cancel_register(); return false;" style="width: 63px; float: right; margin-right:8px;">Cancel</button> <button id="register" onclick="register_user(); return false;" style="width: 63px; float: right;">Save</button> </form></div>'); 

忽略user_msg樣式中指定的信息。如果我用$('#user_msg').html(message);更新文本,這也被忽略。什麼可以解釋這一點?

回答

1

HTML語法錯誤 - 你沒有關閉<div>或樣式屬性這裏面:

$('#matting').append('<div id="register_user_box" class="inline_form"'+ 
    ' style="position: absolute; top: 20px; right: 10px; ' + // missing ">! 
    '<br/><span id="user_msg" style="width: 90%; height: 15px;'+ 
    'color: red; font-family: Arial; font-size: 11px;">Info msg</span> '+ 
    '<br/><form id="register_user_id" name="register_user_form">'+ 
    '<button id="cancel" onclick="cancel_register(); return false;"'+ 
    ' style="width: 63px; float: right; margin-right:8px;">Cancel</button>'+ 
    ' <button id="register" onclick="register_user(); return false;"'+ 
    'style="width: 63px; float: right;">Save</button> </form></div>'); 

還要注意<span>的是內聯元素(見scrappedcola's answer)。

+0

非常感謝您發現問題。我的頭腦一定是在想別的東西。 – user823527 2012-04-18 22:07:08

1

<span>是行內元素。給它的高度和寬度使用css display:inline-block;要添加短信嘗試使用$('#user_msg').text(message);

+0

好的。感謝您的信息。問題是zeta發現的。 – user823527 2012-04-18 22:07:50