Слияние кода завершено, страница обновится автоматически
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link href="files/bootstrap.css" rel="stylesheet">
<link href="files/font-awesome.css" rel="stylesheet">
<link href="files/stylesheet.css" rel="stylesheet">
<link href="files/skins.css" rel="stylesheet">
<link href="files/image-cut.css" rel="stylesheet">
</head>
<body>
<div class="inner">
<div class="modal-body">
<div class="outer-wrapper">
<div id="picViewOuter" class="pic-view-wrapper">
<div id="back" style="cursor: pointer;">
<i class="fa fa-picture-o" style="font-size: 150px;"><div style="font-size:30px !important;">点击选择图片</div></i>
</div>
<table id="picMask" class="hidden">
<tbody>
<tr>
<td id="pP"> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td id="pO">
<div class="pC">
<!-- 定义右下角的控制点-->
<div id="dm_br" class="dm"></div>
<div class="pI"></div>
</div>
</td>
<td> </td>
</tr>
<tr>
<td class="pic-view-height"> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
<img id="sourceimg">
</div>
<div class="ui-slider">
<i id="stepDown" class="fa fa-minus-circle fa-lg"></i>
<div id="sliderBar" class="ui-slider-bar">
<div id="sliderBlock" class="ui-slider-handle" style="left:0%;">
<label class="ui-slider-ratio"><small id="sliderHandlerRatio">0%</small></label>
</div>
</div>
<i id="stepUp" class="fa fa-plus-circle fa-lg"></i>
</div>
</div>
<span id="s_error" style="color:red; display:none;"></span>
<input id="imagesrc" accept="image/*" class="hidden" type="file">
<canvas id="imgcanvas" class="hidden"></canvas>
</div>
<!-- /.modal-body -->
<div class="modal-footer">
<a class="my-btn btn-flat cancel" data-dismiss="modal" id="cancel">关闭</a>
<a class="my-btn btn-flat flat-primary" id="submit">提交</a>
</div>
<script src="files/jquery.js"></script>
<script src="files/image-cut.js"></script>
<script src="../jquery-1.10.2.min.js"></script>
<script type="text/javascript">
var _bucketType = 4;
var param = new Object();
param.fileId = "imagesrc";//必须
param.cutMinW = 20; // 切片最小宽度
param.cutMinH = 20; // 切片最小高度
param.show = false;
imageSelect(param);
document.getElementById("cancel").onclick=function(){
//dialog.close();
}
document.getElementById("submit").onclick = function () {
var result = cutOffImage();
if (result) {
// 继续进行裁剪后的图片引用
var imgcanvas = document.getElementById("imgcanvas");
var data = imgcanvas.toDataURL();
// 删除字符串前的提示信息 "data:image/png;base64,"
var b64 = data.substring(22);
location.href = "data:image/png;base64,"+b64;
return;
/**
以下方法为UE中使用，方法一为将图片转为base64直接插入到UE中。方法二为先将图片先上传服务器，再插入。
注意：嵌入UE之前请先引入相关js文件(dialogs/internal.js)
*/
//方法一
//editor.execCommand('inserthtml', '<img width="'+imgcanvas.width+'px" height="'+imgcanvas.height+'px" src="data:image/png;base64,'+ b64 +'"/>');
//dialog.close();
//方法二
//if (!!b64) {
// var options = {
// timeout:100000,
// onsuccess:function (xhr) {
// var responseObj;
// responseObj = eval("(" + xhr.responseText + ")");
// if (responseObj.state == "SUCCESS") {
// var imgObj = {},
// url = editor.options.scrawlUrlPrefix + responseObj.url;
// imgObj.src = url;
// imgObj._src = url;
// imgObj.alt = responseObj.original || '';
// editor.execCommand("insertImage", imgObj);
// dialog.close();
// } else {
// alert(responseObj.state);
// }
// },
// onerror:function () {
// alert(lang.imageError);
// dialog.close();
// }
// };
// options[editor.getOpt('scrawlFieldName')] = b64;
// var actionUrl = editor.getActionUrl(editor.getOpt('scrawlActionName')),
// params = utils.serializeParam(editor.queryCommandValue('serverparam')) || '',
// url = utils.formatUrl(actionUrl + (actionUrl.indexOf('?') == -1 ? '?':'&') + params);
// ajax.request(url, options);
// }
} else {
var s_error= document.getElementById("s_error");
s_error.innerHTML="请点击右侧“选择图片”, 选择一张图片";
s_error.style.display="block";
}
};
</script>
</div>
</body></html>
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Опубликовать ( 0 )