首页 > 代码库 > 提取编辑中的图片生成缩略图

提取编辑中的图片生成缩略图



<img id="thumb_img" style="width:100px; height:100px; border:1px #ccc solid; margin-top: 15px" src="">
<input id="img" type="hidden" name="thumb_img" value="">


<
span> <label> <input id="autolitpic" type="checkbox"> 提取第一个图片为缩略图 </label> ( <a class="qximg" href="javascript:;">[取消缩略图]</a> ) </span> <label class="textarea"><textarea name="content" id="content" class="content" onblur="content_validate()"></textarea> <input type="hidden" name="parse" value="0"> <script type="text/javascript"> var editor_content1; KindEditor.ready(function(K) { editor_content1 = K.create(textarea[name="content"], { allowFileManager : false, themesPath: K.basePath, width: 900px, height: 700px, resizeType: 1, pasteType : 2, urlType : absolute, cssPath : /statics/js/kindeditor/plugins/code/prettify.css, uploadJson : {:U(ke_upimg)}, afterCreate : function() { this.sync(); }, afterBlur:function(){ this.sync(); } }); prettyPrint(); }); </script> </label>
//获取第一张图片
$(‘#autolitpic‘).click(function (){ 
    if($(this).attr(‘checked‘)){
        $(this).attr(‘checked‘,false);
    }else {
            var content=$(‘.content‘).val();
            if(content.match(/src="http://www.mamicode.com/[^"]+"/g)==null){
               alert(‘文章内容没有图片‘);
               $(this).attr(‘checked‘,false);
             }else{
                 $(this).attr(‘checked‘,true);
                 set_thumb_img();
          }
    }
});

//取消缩略图
$(‘.qximg‘).click(function (){
    cancel_thumb_img();
});
//设置第一个图片为缩略图
function set_thumb_img() {
    var content=$(‘.content‘).val();
    var strcount=content.match(/src="http://www.mamicode.com/[^"]+"/g)[0].replace("src=http://www.mamicode.com/"","");
    var val=strcount.substring(0,strcount.length-1).replace("http://cb2013.tdedu.org","");
    $("#thumb_img").attr(‘src‘,val); 
      $("#img").val(val);
}

//取消缩略图
function cancel_thumb_img() {
    $(‘#thumb_img‘).attr(‘src‘,‘‘); 
    $(‘#img‘).val(‘‘);
}

 

提取编辑中的图片生成缩略图