表单中头像处理判断及回显

&lt;script type="text/javascript"&gt;
 var staticNum = 0;

 function previewNewAvatar(uri, from) {
     staticNum = 0;
     var span = document.getElementById("CurrentAvatar");
     var flag11 = document.getElementById("hiddenflag1");
     var flag12 = document.getElementById("hiddenflag2");
     if (from == "signature") {
         span = document.getElementById("signature");
     }
     var form = document.getElementById("editprofile");
     if (from == "Album") {
         span.innerHTML = "&lt;img id='showface' src='http://image.taobao.com/forum/gallery/" + uri + "' alt='' /&gt;";
     } else {
         if (uri != null) {
             var uris = uri.split(".");
             if (uris[uris.length - 1].toUpperCase() == 'GIF' || uris[uris.length - 1].toUpperCase() == "JPG" || uris[uris.length - 1].toUpperCase() == "JPEG") {
                 uri = "file:///" + uri;
                 //alert(from);
                 if (from == "signature") {
                     span.innerHTML = "&lt;img id='showsign' src='" + uri + "' alt='' onload='return detectSign();'/&gt;";
                 } else {
                     span.innerHTML = "&lt;img id='showface' src='" + uri + "' alt='' onload='return detectFlower();'/&gt;";
                 }
             } else {
                 alert("请上传jpg,jpeg或者gif格式的图片哦！");
                 span.innerHTML = "&lt;img src='' alt='请选择合适的图片!' heigth='120' width='120' /&gt;";
                 //form.reset();
                 if (from == "signature") {
                     flag11.value = 1;
                 } else {
                     flag12.value = 1;
                 }
                 return;
             }
         }
     }
 }

 function imgExceedSize(w, h, value) {
     var flag21 = document.getElementById("hiddenflag1");
     var flag22 = document.getElementById("hiddenflag2");
     var show = document.getElementById("showface");
     var span = document.getElementById("CurrentAvatar");
     if (value == "signature") {
         show = document.getElementById("showsign");
         span = document.getElementById("signature");
     }
     var form = document.getElementById("editprofile");
     //alert("width:"+show.width);
     //alert("height:"+show.height);
     if (show.width &gt; w || show.height &gt; h) {
         alert("图像尺寸：" + show.width + "X" + show.height + "。/n图像尺寸过大!你只能上传尺寸为 " + w + "×" + h + "的图像，请重新浏览图片！");
         span.innerHTML = "&lt;img src='' alt='请选择合适的图片!' width='120' width='120'&gt;";
         //form.reset();
         if (value == "signature") {
             //alert("signature flag1:" + flag21);
             flag21.value = 1;
         } else {
             //alert("no flag1:" + flag22);
             flag22.value = 1;
         }
         return false;
     } else {
         if (value == "signature") {
             //alert("signature flag1:" + flag21);
             flag21.value = 0;
         } else {
             //alert("no flag1:" + flag22);
             flag22.value = 0;
         }
         return true;
     }
 }
 function detectFlower() {
     if (0 == staticNum) {
         staticNum++;
         var ok = imgExceedSize(120, 120, 'CurrentAvatar');
     }
 }
 function detectSign() {
     if (0 == staticNum) {
         staticNum++;
         var ok = imgExceedSize(468, 60, 'signature');
     }
 } --&gt;
&lt;/script&gt;
&lt;hr /&gt;
&lt;div class="FormElement"&gt;
    &lt;label&gt;
        头像：
    &lt;/label&gt;
    &lt;div&gt;
        &lt;input name="_fmf.edi._0.a" id="ep.pic1" type="radio" value="1" tabindex="1"
        /&gt;
        &lt;label for="ep.pic1"&gt;
            启用
        &lt;/label&gt;
        &lt;input name="_fmf.edi._0.a" id="ep.pic2" type="radio" value="0" tabindex="2"
        checked="checked" /&gt;
        &lt;label for="ep.pic2"&gt;
            关闭
        &lt;/label&gt;
        &lt;p&gt;
            启用此选项，你发表的每一个帖子左侧将显示您的头像。
        &lt;/p&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;div class="FormElement"&gt;
    &lt;label&gt;
        当前头像：
    &lt;/label&gt;
    &lt;div id="CurrentAvatar"&gt;
        无头像
    &lt;/div&gt;
&lt;/div&gt;
&lt;input type="hidden" name="_fmf.edi._0.av" value="0" /&gt;
&lt;input type="hidden" name="_fmf.edi._0.user" value="" /&gt;
&lt;div class="FormElement"&gt;
    &lt;label&gt;
        上传新头像：
    &lt;/label&gt;
    &lt;div&gt;
        &lt;input id="headpicture" name="userAvatar" type="file" tabindex="3" onchange="previewNewAvatar(this.value,'currentavatar')"
        /&gt;
        &lt;p&gt;
            要求：图片尺寸最大120*120像素，文件大小100k以内（支持JPG，GIF）。
        &lt;/p&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;div class="FormElement"&gt;
    &lt;label&gt;
        系统相册：
    &lt;/label&gt;
    &lt;div&gt;
        &lt;input name="new_avatar_uri" id="NewAvatarURI" type="hidden" value=""
        /&gt;
        &lt;input name="open_avatar_list" type="button" tabindex="4" value="打开系统相册"
        onclick="javascript:window.open('forumPic.htm');" /&gt;
        &lt;p&gt;
            从系统相册中选择一个头像（如果您的浏览器打开了屏蔽弹出窗口的功能，请关闭）。
        &lt;/p&gt;
    &lt;/div&gt;
&lt;/div&gt;

&lt;form action="#" id="AvatarSelector"&gt;
    &lt;table border="0" cellpadding="3" cellspacing="0" width="100%" class="AvatarList"&gt;
        &lt;tr&gt;
            &lt;td&gt;
                &lt;input type="radio" name="avatarselect" value="002/icons-302.gif" /&gt;
                &lt;img src="http://image.taobao.com/forum/gallery/002/icons-302.gif" alt="Icons-302"
                title="Icons-302" /&gt;
            &lt;/td&gt;
            &lt;td&gt;
                &lt;input type="radio" name="avatarselect" value="002/icons-306.gif" /&gt;
                &lt;img src="http://image.taobao.com/forum/gallery/002/icons-306.gif" alt="Icons-306"
                title="Icons-306" /&gt;
            &lt;/td&gt;
            &lt;td&gt;
                &lt;input type="radio" name="avatarselect" value="002/icons-307.gif" /&gt;
                &lt;img src="http://image.taobao.com/forum/gallery/002/icons-307.gif" alt="Icons-307"
                title="Icons-307" /&gt;
            &lt;/td&gt;
            &lt;td&gt;
                &lt;input type="radio" name="avatarselect" value="002/icons-308.gif" /&gt;
                &lt;img src="http://image.taobao.com/forum/gallery/002/icons-308.gif" alt="Icons-308"
                title="Icons-308" /&gt;
            &lt;/td&gt;
            &lt;td&gt;
                &lt;input type="radio" name="avatarselect" value="002/icons-309.gif" /&gt;
                &lt;img src="http://image.taobao.com/forum/gallery/002/icons-309.gif" alt="Icons-309"
                title="Icons-309" /&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
        &lt;tr&gt;
            &lt;td&gt;
                &lt;input type="radio" name="avatarselect" value="002/icons-302.gif" /&gt;
                &lt;img src="http://image.taobao.com/forum/gallery/002/icons-302.gif" alt="Icons-302"
                title="Icons-302" /&gt;
            &lt;/td&gt;
            &lt;td&gt;
                &lt;input type="radio" name="avatarselect" value="002/icons-306.gif" /&gt;
                &lt;img src="http://image.taobao.com/forum/gallery/002/icons-306.gif" alt="Icons-306"
                title="Icons-306" /&gt;
            &lt;/td&gt;
            &lt;td&gt;
                &lt;input type="radio" name="avatarselect" value="002/icons-307.gif" /&gt;
                &lt;img src="http://image.taobao.com/forum/gallery/002/icons-307.gif" alt="Icons-307"
                title="Icons-307" /&gt;
            &lt;/td&gt;
            &lt;td&gt;
                &lt;input type="radio" name="avatarselect" value="002/icons-308.gif" /&gt;
                &lt;img src="http://image.taobao.com/forum/gallery/002/icons-308.gif" alt="Icons-308"
                title="Icons-308" /&gt;
            &lt;/td&gt;
            &lt;td&gt;
                &lt;input type="radio" name="avatarselect" value="002/icons-309.gif" /&gt;
                &lt;img src="http://image.taobao.com/forum/gallery/002/icons-309.gif" alt="Icons-309"
                title="Icons-309" /&gt;
            &lt;/td&gt;
        &lt;/tr&gt;
    &lt;/table&gt;
&lt;/form&gt;
&lt;hr /&gt;
&lt;div style="text-align:center;"&gt;
    &lt;input type="button" name="submitavatar" value="选择头像" class="mainoption"
    onclick="doSelect();" /&gt;
&lt;/div&gt;
&lt;script type="text/javascript"&gt;
 function doSelect() {
     var x = document.getElementById("AvatarSelector").avatarselect;
     for (var i = 0; i &lt; x.length; i++) {
         if (x[i].checked) {
             window.opener.document.getElementById("NewAvatarURI").value = x[i].value;
             window.opener.previewNewAvatar(x[i].value, "Album");
             window.close();
         }
     }
 }
&lt;/script&gt;

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

202

203

204

205

206

207

208

209

210

211

212

213

214

215

216

217

218

219

220

221

var staticNum = 0;

function previewNewAvatar(uri, from) {

staticNum = 0;

var span = document.getElementById("CurrentAvatar");

var flag11 = document.getElementById("hiddenflag1");

var flag12 = document.getElementById("hiddenflag2");

if (from == "signature") {

span = document.getElementById("signature");

}

var form = document.getElementById("editprofile");

if (from == "Album") {

span.innerHTML = "<img id='showface' src='http://image.taobao.com/forum/gallery/" + uri + "' alt='' />";

} else {

if (uri != null) {

var uris = uri.split(".");

if (uris[uris.length - 1].toUpperCase() == 'GIF' || uris[uris.length - 1].toUpperCase() == "JPG" || uris[uris.length - 1].toUpperCase() == "JPEG") {

uri = "file:///" + uri;

//alert(from);

if (from == "signature") {

span.innerHTML = "<img id='showsign' src='" + uri + "' alt='' onload='return detectSign();'/>";

} else {

span.innerHTML = "<img id='showface' src='" + uri + "' alt='' onload='return detectFlower();'/>";

}

} else {

alert("请上传jpg,jpeg或者gif格式的图片哦！");

span.innerHTML = "<img src='' alt='请选择合适的图片!' heigth='120' width='120' />";

//form.reset();

if (from == "signature") {

flag11.value = 1;

} else {

flag12.value = 1;

}

return;

}

function imgExceedSize(w, h, value) {

var flag21 = document.getElementById("hiddenflag1");

var flag22 = document.getElementById("hiddenflag2");

var show = document.getElementById("showface");

var span = document.getElementById("CurrentAvatar");

if (value == "signature") {

show = document.getElementById("showsign");

span = document.getElementById("signature");

}

var form = document.getElementById("editprofile");

//alert("width:"+show.width);

//alert("height:"+show.height);

if (show.width > w || show.height > h) {

alert("图像尺寸：" + show.width + "X" + show.height + "。/n图像尺寸过大!你只能上传尺寸为 " + w + "×" + h + "的图像，请重新浏览图片！");

span.innerHTML = "<img src='' alt='请选择合适的图片!' width='120' width='120'>";

//form.reset();

if (value == "signature") {

//alert("signature flag1:" + flag21);

flag21.value = 1;

} else {

//alert("no flag1:" + flag22);

flag22.value = 1;

}

return false;

} else {

if (value == "signature") {

//alert("signature flag1:" + flag21);

flag21.value = 0;

} else {

//alert("no flag1:" + flag22);

flag22.value = 0;

}

return true;

}

function detectFlower() {

if (0 == staticNum) {

staticNum++;

var ok = imgExceedSize(120, 120, 'CurrentAvatar');

}

function detectSign() {

if (0 == staticNum) {

staticNum++;

var ok = imgExceedSize(468, 60, 'signature');

}

} -->

</script>

<hr />

<label>

头像：

</label>

<div>

<input name="_fmf.edi._0.a" id="ep.pic1" type="radio" value="1" tabindex="1"

启用

</label>

<input name="_fmf.edi._0.a" id="ep.pic2" type="radio" value="0" tabindex="2"

checked="checked" />

关闭

</label>

<p>

启用此选项，你发表的每一个帖子左侧将显示您的头像。

</p>

</div>

<label>

当前头像：

</label>

无头像

</div>

<label>

上传新头像：

</label>

<div>

<input id="headpicture" name="userAvatar" type="file" tabindex="3" onchange="previewNewAvatar(this.value,'currentavatar')"

<p>

要求：图片尺寸最大120*120像素，文件大小100k以内（支持JPG，GIF）。

</p>

</div>

<label>

系统相册：

</label>

<div>

<input name="new_avatar_uri" id="NewAvatarURI" type="hidden" value=""

<input name="open_avatar_list" type="button" tabindex="4" value="打开系统相册"

onclick="javascript:window.open('forumPic.htm');" />

<p>

从系统相册中选择一个头像（如果您的浏览器打开了屏蔽弹出窗口的功能，请关闭）。

</p>

</div>

<tr>

<td>

<img src="http://image.taobao.com/forum/gallery/002/icons-302.gif" alt="Icons-302"

title="Icons-302" />

</td>

<td>

<img src="http://image.taobao.com/forum/gallery/002/icons-306.gif" alt="Icons-306"

title="Icons-306" />

</td>

<td>

<img src="http://image.taobao.com/forum/gallery/002/icons-307.gif" alt="Icons-307"

title="Icons-307" />

</td>

<td>

<img src="http://image.taobao.com/forum/gallery/002/icons-308.gif" alt="Icons-308"

title="Icons-308" />

</td>

<td>

<img src="http://image.taobao.com/forum/gallery/002/icons-309.gif" alt="Icons-309"

title="Icons-309" />

</td>

</tr>

<tr>

<td>

<img src="http://image.taobao.com/forum/gallery/002/icons-302.gif" alt="Icons-302"

title="Icons-302" />

</td>

<td>

<img src="http://image.taobao.com/forum/gallery/002/icons-306.gif" alt="Icons-306"

title="Icons-306" />

</td>

<td>

<img src="http://image.taobao.com/forum/gallery/002/icons-307.gif" alt="Icons-307"

title="Icons-307" />

</td>

<td>

<img src="http://image.taobao.com/forum/gallery/002/icons-308.gif" alt="Icons-308"

title="Icons-308" />

</td>

<td>

<img src="http://image.taobao.com/forum/gallery/002/icons-309.gif" alt="Icons-309"

title="Icons-309" />

</td>

</tr>

</table>

</form>

<hr />

<input type="button" name="submitavatar" value="选择头像" class="mainoption"

onclick="doSelect();" />

</div>

function doSelect() {

var x = document.getElementById("AvatarSelector").avatarselect;

for (var i = 0; i < x.length; i++) {

if (x[i].checked) {

window.opener.document.getElementById("NewAvatarURI").value = x[i].value;

window.opener.previewNewAvatar(x[i].value, "Album");

window.close();

}

</script>

2025 年 7 月
一	二	三	四	五	六	日
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30	31

发表回复 取消回复

相关文章

发表回复取消回复