Question

我有一个带有可点击的div的页面，这些div已经用Json动态填充。 div包含项目列表，当我点击特定项目时，我会得到一个新页面，其中包含所单击项目的名称和详细信息。我的问题是，如果你可以提供一些帮助，我无法弄清楚如何显示项目的标签（名称）。非常感谢！

这是我的JSON数组：

$data['dataHeader'] = array('id', 'Name', 'Value');
$data['dataJson']   = array(
                        array('id1', 'Jeans', 'blablablabla'),
                        array('id2', 'Leather Jacket', 'some random description'),
                        array('id3', 'Suede Boots', 'description of boots')
                    );

这是我试图做的事情：

(function( $ ) {        
    // Plugin to clickable element
    $.fn.infoClickable = function() {
        this.each(function() {          
            // get the object
            var elm = $( this );                
            // Define click event
            elm.on("click", function(){ 
                //Get info relative to clicked element          
                var currentPage         = elm.data("page");
                loadPage_X_Content(elm);
            });
        });
    }       
    // Load page 1
    loadPage1Content();
    // Application du plug-in
    $('.clickableDiv').infoClickable();
}( jQuery ));

function loadPage_X_Content(elm){
     var nextPage    = currentPage + 1;
     var nextPageName = '#LV' + nextPage +'Content';
     arrayOfData      = reponseData;
     currentValue     = arrayOfData;
     var elm          = $( this );
     var elmID        = elm.attr("id");
     var PageContent    = '';
     PageContent  += '<div>' + elmID + '</div>';

     $.ajax({
        url : "Pages/index.php",
        type:  'GET',
        dataType: 'json',
        data: 'action=loadPage' + '&ID=' + elmID,
        success: function(reponseData) {

标题：

        LVContent += '<div class="HeaderLine">';
        $.each(arrayOfData['dataHeader'], function(currentIdx, currentValue)
        {
              if (currentIdx > 0)   PageContent += '<div class="' + arrayOfData[currentIdx] + '">'+ currentValue +'</div>';
         });

对于数据：

         $.each(arrayOfData['dataJson'], function(currentIdx, currentValue){
              PageContent += '<div class="BlocLine clickableDiv" ';                 
              PageContent += ' id="' + currentIdx + "_" + currentContext + '"';
              PageContent += ' >';
              // columns
              $.each(currentValue, function(currentIdx, currentValueCol){
                   if (currentIdx > 0){
                   PageContent += '<div class=" '+ arrayOfData[currentIdx] +' "';
                   PageContent += ' >'+ currentValueCol +'</div>';                          
              }
         });
         PageContent += '</div>';
    });
    $(nextPageName).append(PageContent);
    $(nextPageName).find('.clickableDiv').infoClickable();

});

Answer 1

包含的代码未指定elm是什么。

所以只是澄清，是你的榆树：

 var elm = document.getElementById('theAttrDivId');

此外，您要求提供名称，但要搜索ID，因此请确保：

 var elmID = elm.attr("name");

显示所单击项目的值（标签名称）

1 个答案: