李涵 / integral · 提交

转到一个项目

作者 李洪娟
提交 9086b4677acc2c93fed931e2b4eff96ccac85d14 1 个父辈 cc01bf4b
1 个管道 的构建 通过 耗费 2 秒

修改评价页面

内嵌 并排对比
正在显示 7 个修改的文件 包含 96 行增加 和 25 行删除
... ... @@ -25,7 +25,6 @@
position:absolute;
left:0;
top:0
}
</style>
</head>
... ...
... ... @@ -160,7 +160,7 @@
}
}
})
})
});
//发送验证码
... ... @@ -170,7 +170,7 @@
var t=localStorage.getItem("time");
InterValObj = window.setInterval(SetRemainTime,1000);
if(t!=null){
curCount=t;
... ...
... ... @@ -67,12 +67,37 @@
.enter_photo{
width:1.8rem;
height:1.8rem;
margin: 0 0.8rem 0 0;
}
.addphoto{
width:1.8rem;
height:1.8rem;
margin-top:0.1rem;
}
#preview{
width:1.6rem;
height:1.6rem;
margin-top:0.1rem;
margin-left: 0.24rem;
}
#preview img{
width:100%;
height:100%;
}
.pushimg{
position:relative;
}
.cancel{
width:0.32rem;
height:0.32rem;
font-size: 0;
position: absolute;
left:1.4rem;
top:0.1rem;
}
.cancel img{
width:100%;
height:100%;
}
.enter_photo img,.addphoto img{
width:100%;
... ... @@ -94,6 +119,7 @@
border-radius: 0.44rem;
}
</style>
</head>
<body>
<div class="container">
... ... @@ -103,44 +129,36 @@
<img src="__INDEX__/img/rank1red.png" alt="">
</p>
<p class="evalute_text active">好评</p>
</div>
<div class="rank_type">
<p class="rank_type_img">
<img src="__INDEX__/img/rank2gray.png" alt="">
</p>
<p class="evalute_text">中评</p>
</div>
<div class="rank_type">
<p class="rank_type_img">
<img src="__INDEX__/img/rank3gray.png" alt="">
</p>
<p class="evalute_text">差评</p>
</div>
</div>
<div class="writevalute">
<textarea name="" id="write_evalute" cols="30" rows="10" placeholder="请写下您的评价"></textarea>
</div>
<div class="photo">
<div style="display:flex">
<p class="enter_photo">
<img src="__INDEX__/img/apic01.png" alt="">
</p>
<div class="addimg" style="display:flex">
</div>
<div class="addphoto">
<!--__INDEX__/img/addimg.png-->
<div id="preview">
<img id="imghead" border="0" src="__INDEX__/img/tianjia@2x.png" style="width:100%;height:100%" onclick="$('#previewImg').click();">
</div>
<!--<img src="__INDEX__/img/delet.png" alt="" style="position:absolute;bottom:92px;left:46px" class="deleteimg"/>-->
<input type="file" onchange="previewImage(this)" style="display: none;" id="previewImg">
</div>
<!--<p class="addphoto">-->
<!--<img src="__INDEX__/img/tianjia@2x.png" alt="">-->
<!--</p>-->
</div>
<div class="publish">
发表
... ... @@ -149,6 +167,35 @@
</body>
<script src="__INDEX__/js/jquery.min.js"></script>
<script>
//好评，中评，差评
$(".rank_type").click(function(){
$(this).children(".evalute_text").addClass("active");
$(this).siblings(".rank_type").children(".evalute_text").removeClass("active");
if($(this).children(".evalute_text").html()=='好评'){
$(this).children(".rank_type_img").children("img").attr("src","../img/rank1red.png");
if($(this).siblings(".rank_type").children(".evalute_text").html()=="中评"){
$(this).siblings(".rank_type").children(".rank_type_img").children("img").attr("src","__INDEX__/img/rank2gray.png");
}else if($(this).siblings(".rank_type").children(".evalute_text").html()=="差评"){
$(this).siblings(".rank_type").children(".rank_type_img").children("img").attr("src","__INDEX__/img/rank3gray.png");
}
}else if($(this).children(".evalute_text").html()=='中评'){
$(this).children(".rank_type_img").children("img").attr("src","../img/rank2red.png");
if($(this).siblings(".rank_type").children(".evalute_text").html()=="好评"){
$(this).siblings(".rank_type").children(".rank_type_img").children("img").attr("src","__INDEX__/img/rank1gray.png");
}else if($(this).siblings(".rank_type").children(".evalute_text").html()=="差评"){
$(this).siblings(".rank_type").children(".rank_type_img").children("img").attr("src","__INDEX__/img/rank3gray.png");
}
}else if($(this).children(".evalute_text").html()=='差评'){
$(this).children(".rank_type_img").children("img").attr("src","../img/rank3red.png");
if($(this).siblings(".rank_type").children(".evalute_text").html()=="好评"){
$(this).siblings(".rank_type").children(".rank_type_img").children("img").attr("src","__INDEX__/img/rank1gray.png");
}else if($(this).siblings(".rank_type").children(".evalute_text").html()=="中评"){
$(this).siblings(".rank_type").children(".rank_type_img").children("img").attr("src","__INDEX__/img/rank2gray.png");
}
}
})
function clacImgZoomParam(maxWidth, maxHeight, width, height) {
var param = {
top: 0,
... ... @@ -172,8 +219,6 @@
param.top = Math.round((maxHeight - param.height) / 2);
return param;
}
function previewImage(file) {
var MAXWIDTH =60;
var MAXHEIGHT =77;
... ... @@ -186,11 +231,12 @@
img.width = rect.width;
img.height = rect.height;
// img.style.marginLeft = rect.left+'px';
img.style.marginTop = rect.top + 'px';
//img.style.marginTop = rect.top + 'px';
}
var reader = new FileReader();
reader.onload = function(evt) {
img.src = evt.target.result;
//img.src = evt.target.result;
img.src='__INDEX__/img/tianjia@2x.png';
}
reader.readAsDataURL(file.files[0]);
} else //兼容IE
... ... @@ -205,9 +251,35 @@
status = ('rect:' + rect.top + ',' + rect.left + ',' + rect.width + ',' + rect.height);
div.innerHTML = "<div id=divhead style='width:" + rect.width + "px;height:" + rect.height + "px;margin-top:" + rect.top + "px;" + sFilter + src + "\"'></div>";
}
var text='';
text+=' <div class="pushimg">' +
'<p class="enter_photo">' +
'<img src="__INDEX__/img/apic01.png" alt="">' +
'</p>' +
'<p class="cancel">' +
'<img src="__INDEX__/img/cancel.png" alt="">' +
'</p>' +
'</div>'
$(".addimg").append(text);
$(this).attr("src","__INDEX__/img/tianjia@2x.png");
var len=$(".enter_photo");
console.log(len.length)
if(len==3){
$("#preview").css("display","none")
}
//删除图片
console.log($(".addimg"))
$(".addimg").on("click",".cancel",function(){
$(this).parent(".pushimg").remove()
})
// var formData = new FormData();
// var fileM = document.querySelector("#previewImg");
// var fileObj = fileM.files[0];
// var fileM = document.querySelector("#previewImg");
// console.log(fileM)
// var fileObj = fileM.files[0];
// console.log(fileObj);
// formData.append("files", fileObj);
// $.ajax({
// url: 'http://hula.wx.bronet.cn/index.php/MyComment/upload',
... ... @@ -227,14 +299,14 @@
// text += '<div class="evaluate_pic_item" style="float:left">' +
// '<img src="' + pic + '" class="delimg"/>' +
// '<div class="icon">' +
// '<img src="__INDEX__/img/10拷贝2@2x_59.png" />' +
// '<img src="../img/cancel.png" />' +
// '</div>' +
// '</div>'
// $(".addimg").append(text);
// if(imgurl.length == 3) {
// $(".imgone").css("display", "none");
// }
// $("#imghead").attr("src","__INDEX__/img/3@2x.png");
// $("#imghead").attr("src","../img/3@2x.png");
// },
// error: function() {
//
... ...