Question

我的页面中有以下HTML：

<div id="RotationImages" style="display:none">
    <input id="FirstImage" type="hidden" src="/english/images/spa.jpg" title="Enjoy a refreshing shower at 43,000 feet" alt="Enjoy a refreshing shower at 43,000 feet" height="326" width="980" header="Enjoy a refreshing shower at 43,000 feet" subheader="One of many groundbreaking amenities on the Flight" color="" href="1"/>

    <input id="SecondImage" type="hidden" src="/english/images/lounge.jpg" title="Socialize, relax, and indulge" alt="Socialize, relax, and indulge" height="326" width="980" header="Socialize, relax, and indulge" subheader="First and Business Class onboard lounges" color="" href="2"/>

    <input id="ThirdImage" type="hidden" src="/english/images/flatbeds.jpg" title="Arrive at your destination rested and relaxed" alt="Arrive at your destination rested and relaxed" height="326" width="980" header="Arrive rested and relaxed" subheader="Enjoy lie-flat comfort on our most modern aircraft" color="" href="3"/>
</div>

我正在尝试使用JQuery生成以下HTML格式，但很难获得它。

   {"img_src":"/english/images/spa.jpg",
    "img_title":"Enjoy a refreshing shower at 43,000 feet",
    "img_alt":"Enjoy a refreshing shower at 43,000 feet",
    "img_height":"326",
    "img_width":"980",
    "header":"Enjoy a refreshing shower at 43,000 feet",
    "subheader":"One of many groundbreaking amenities on the Flight",
    "bg_color":"",
    "url_href":"1"},

以下是JQuery：

$('.slideshow').liveBanner([
        var rotationImagelength = $('#RotationImages input[type=hidden]').length;

        $('#RotationImages input[type=hidden]').each(function(index,element)
        {            
            thisVal = $(this).val();
            var $this = $(this); 
            var LastImageDetail;  
            var ImageDetail;        
            if(index != rotationImagelength - 1) 
            {                    
                ImageDetail = '{"img_src":"'+ $(element).attr("src")+'", "img_title":"'+ $(element).attr("title")+'","img_alt":"'+ $(element).attr("alt")+'", "img_height":"'+ $(element).attr("height")+'","img_width":"'+ $(element).attr("width")+'","header":"'+ $(element).attr("header")+'","subheader":"'+ $(element).attr("subheader")+'","bg_color":"'+ $(element).attr("color")+'","url_href":"'+ $(element).attr("href")+'"},';                                                  
            }    
            else
            {
                ImageDetail = '{"img_src":"'+ $(element).attr("src")+'", "img_title":"'+ $(element).attr("title")+'","img_alt":"'+ $(element).attr("alt")+'", "img_height":"'+ $(element).attr("height")+'","img_width":"'+ $(element).attr("width")+'","header":"'+ $(element).attr("header")+'","subheader":"'+ $(element).attr("subheader")+'","bg_color":"'+ $(element).attr("color")+'","url_href":"'+ $(element).attr("href")+'"}';                                                  
            }                
            var fromPageInput = $("<input>").attr("type", "hidden").attr("name", "fromPage").val(ImageDetail); 
            $("#RotationImages").append($(fromPageInput)); 

        })

],{"autostart":false,
        "pause_time":5500,
        "random":false});

在上面的JQuery代码中，我能够获得所需的所有值，只是很少混淆添加所有的一堆，现在它是在我的div中附加每个图像细节，但是我想要一个在一起，请调整什么我需要在我的代码中执行以在一个输入中获取所有图像细节

如何使用JQuery生成所需的HTML格式

0 个答案: