码迷,mamicode.com
首页 > Web开发 > 详细

jQuery替换常用标签

时间:2016-04-15 18:22:23      阅读:195      评论:0      收藏:0      [点我收藏+]

标签:

使用jQuery替换HTML的常用标签,重组FORM的表单的HTML。

/**
 * Created by bayayun on 2016/3/28.
 * 模板替换
 */
function copyForm(el) {
    /*获取表单的HTML代码*/
    var form = $(el).html();
    $(‘#hideWrap‘).html(‘‘);
    $(‘#hideWrap‘).html(form);
    $("input[name=‘_ajax‘]","#hideWrap").remove();
    /*原表单值 处理input*/
    var source = $(‘input‘, el);
    $(‘#hideWrap input‘).each(function (i) {
        var inputval = $(source[i]).val();
        var type = $(this).attr(‘type‘);
        /*如果input的type属性是隐藏就删除*/
        if(type !== ‘hidden‘){
            var str = ‘‘;
            if (inputval != ‘‘) {
                str += "<span>" + inputval + "</span>";
            } else {
                str += "<span>&nbsp;&nbsp;</span>";
            }
            $(this).replaceWith($(str));
        }else{
            $(this).remove();
        }

    });
    /*原表单值 处理图片 获取显示值替换标签*/
    $(‘#hideWrap .form-actions‘).remove();
    /*处理联动select*/
    $(‘#hideWrap .mcSelect‘).each(function(){
        $(this).replaceWith($(this).html());
    });
    /*原表单值 处理select 获取select option:select 显示值*/
    var seled = $(‘select option:selected‘, el);
    var selects = $(‘select‘, el);
    $(‘#hideWrap select‘).each(function (e){
        var selval = $(selects[e]).val();
        var sel = ‘‘;
        if(selval){
            var seledval = $(seled[e]).text();
            if(seledval){
                sel += "<span>" + seledval + "</span>";
            }
        }else{
            sel += "<span>&nbsp;&nbsp;</span>";
        }
        $(this).replaceWith($(sel));
    });
    /*原表单值 处理textarea 获取显示值替换标签*/
    var textar = $(‘textarea‘,el);
    $(‘#hideWrap textarea‘).each(function (d){
        var textval = $(textar[d]).val();
        var texts = ‘‘;
        if(textval){
            texts += "<p>" + textval + "</p>";
        }else{
            texts += "<p>&nbsp;&nbsp;</p>";
        }
        $(this).replaceWith($(texts));
    });
    //console.log( $(‘#hideWrap‘).html());
    /*获取图片,替换图片*/
    //var imgval = $(‘#formWrap .hiduploader img‘).attr(‘src‘);
    //var imgstr = ‘‘;
    //if (imgval != ‘‘) {
    //    imgstr += "<img alt=‘纸质版合同‘ src="+imgval+" class=‘img-reponsetive‘>";
    //} else {
    //    imgstr += "<img alt=‘纸质版合同‘ src=‘/frame/public/assets/global/img/none.png‘ class=‘img-reponsetive‘>";
    //}
    //$(‘#hideWrap .hiduploader‘).html();
    //$(‘#hideWrap .hiduploader‘).html(imgstr);

    /* 
     *
     * 循环遍历图片
     * author wyh
     * */
    var imgval = ‘‘;
    var imgstr = ‘‘;
    $(‘#hideWrap .hiduploader img‘).each(function(){
      if (typeof($(this).attr(‘alt‘)) !== ‘undefined‘) {
        imgval = $(this).attr(‘src‘);
        if (imgval != ‘‘) {
          imgstr = "<div class=‘thumbnail‘> <img alt=‘"+$(this).attr(‘alt‘)+"‘ src="+imgval+" class=‘img-reponsetive‘></div>";
        } else {
           imgstr = "<img alt=‘‘ src=‘/frame/public/assets/global/img/none.png‘ class=‘img-reponsetive‘>";
        }
        $(this).closest(‘.hiduploader‘).html(imgstr);
      }
    });

    var formhtml = $(‘#hideWrap‘).html();
    $("input[name=‘formhtml‘]", el).val(formhtml);
}
 

 

jQuery替换常用标签

标签:

原文地址:http://www.cnblogs.com/520fyl/p/5396236.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!