jquery樣式div並根據div標籤添加標題

你好傢伙我有一個非常標準的div與CSS，我想追加到一個已經存在的給定類的div。這裏是我的標記jquery樣式div並根據div標籤添加標題

<div id ="one" class="PortalBox"> 

    </div> 

    <div class="ab_Box1d"> 
       <div style="width:600px;"> 
        <%@ include file="./concur-reports/index.html"%> 
       </div> 
    </div> <!--finish ab_box1d--> 


</div>

這裏是我的jQuery。

$(document).ready(function() { 
$(".PortalBox").each(function(){ 
    var ThisCss = $('<div class="ab_Box1a" id="report1" style="width:640px; padding-top:6px;">'+ 
      '<div class="ab_Box1b" id="reportchild1"> </div>' + 
       '<table class="ab_Box1c" width="100%" border="0"'+ 
        'cellspacing="0" cellpadding="0">'+ 
       '<tr>'+ 
        '<td style="text-align:left">Concur Reports</td>'+ 
       '</tr>'+ 
      '</table>' 
    + 
    '</div>') 
    ThisCss.insertAfter('.PortalBox'); 
    }); 
});

所以基本上我想追加jQuery中的標記時，我對任何的div絆倒帶班「PortalBox」不過，我需要做的一部分動態至極基本上會是一個標題這部分

'<td style="text-align:left">my channel</td>'+

需要動態地從另一個帶有div的HTML屬性中獲取標題。我可以添加一個「標題」屬性的div標籤的值，我如何使這可能與jQuery的？或java腳本我願意接受任何想法，以備選解決方案。在此先感謝。

來源

2013-01-04 Miguel

把標題在data-*屬性：

<div data-title="my channel" class="PortalBox"></div>

然後，您可以使用jQuery檢索：

$('.PortalBox').data('title');

下面是完整的代碼：

$(document).ready(function() { 
    var report = $('<div class="ab_Box1a" style="width:640px; padding-top:6px;">'+ 
     '<div class="ab_Box1b" ></div>' + 
     '<table class="ab_Box1c" width="100%" border="0"'+ 
     'cellspacing="0" cellpadding="0">'+ 
     '<tr>'+ 
     '<td style="text-align:left">Concur Reports</td>'+ 
     '</tr>'+ 
     '</table>'+ 
     '</div>'); 

    $(".PortalBox").each(function() { 
     report.clone() 
      .find('td').text($(this).data('title')) 
      .appendTo(this); 
    }); 
});

請注意constructin像這樣的HTML片段是非常容易出錯的。如果你發現自己經常這樣做，你應該考慮使用模板系統。

來源

2013-01-04 15:08:57

感謝您的迴應約瑟夫，認爲你的解決方案似乎工作它由於某種原因overide我的CSS？換句話說，它看起來好像沒有爲該標題選擇風格？有任何想法嗎？我當然會更深入地考慮模板 – Miguel

@Miguel - 我已經從標記中刪除了ID，因爲您不能在不同的元素上重複使用相同的ID。你將不得不編輯你的CSS來定位類名。 –

謝謝，但我沒有應用id的樣式。換句話說，它不會從class =「ab_Box1c」中拾取樣式。這是我最後一個問題，我保證對noob問題感到抱歉。 – Miguel

$('div selector').attr('title', enterDesiredvalue);

來源

2013-01-04 15:09:41 kidwon

不知道你在做什麼，但實際上'title'屬性是HTML中的工具提示。所以@約瑟夫的方式實際上更好 – kidwon

jquery樣式div並根據div標籤添加標題

回答

相關問題