PHP - 点击更换头像

原理:

操作流程:

首先点击头像图片,弹出选择窗口,选中其中一个则窗口推出头像更换。

效果:

主页面代码:

<tr>
    <td>头像:</td>

    <td><input type="hidden" name="face" value=""/>
    <img src="./face/m01.gif" alt="头像" class="face" id=‘faceimg‘ onclick="javascript:window.open(‘face.php‘,‘face‘,‘width=420,height=600,top=0,left=0,scrollbars=1‘);"/></td>
</tr>

子页面代码(弹出窗体页面):

    <div id="face">
        <h3>请选择头像:</h3>

            <?php foreach ($facearray as $num){
                    echo "<img src=‘face/".$num."‘ alt=‘face/".$num."‘ title=‘".$num."‘/>";
            }?>

    </div>

使用的JS代码:
引用:

    <!-- 点击更换头像 -->
    <script type="text/javascript" src="./js/face.js"></script>    

代码:

window.onload =  function() {
    //获取face.php页面中的头像对象
    var img = document.getElementsByTagName(‘img‘);
    //进行循环
    for(i=0;i<img.length;i++){
        //对选择的对象触发点击事件
        img[i].onclick = function (){
            //调用 _opener()函数
            _opener(this.alt);
        };
    }
}

//显示头像函数
function _opener(src){
    //获取父页面头像对象
    var faceimg = opener.document.getElementById(‘faceimg‘);
    //将头像的img更换
    faceimg.src = src;
    //将父页面中的register表单中的name为face的值更改为src。
    opener.document.register.face.value = src;
}
时间: 2024-10-14 20:08:35

PHP - 点击更换头像的相关文章

【学习ios之路:UI系列】点击更换头像实现从相册读取照片和拍照两种功能

功能如下: 1.点击头像,提示选择更换头像方式①相册 ②照相. 2.点击相册,实现通过读取系统相册,获取图片进行替换. 3.点击照相,通过摄像头照相,进行替换照片. 4.如果摄像头,弹出框警告. 代码如下: 1.通过UIActionSheet对象实现提示功能 //创建对象 UIActionSheet *actionSheet = [[UIActionSheet alloc] initWithTitle: @"提示" delegate:self cancelButtonTitle:@&q

Android ImageView 点击更换头像

首先搭建布局 主界面布局: 1 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" 2 android:layout_width="match_parent" 3 android:layout_height="match_parent" 4 android:orientation="horizontal" > 5 6

thinkphp验证码点击更换js实现

<img src="__CONTROLLER__/verify" alt="" onclick=this.src="__CONTROLLER__/verify/"+Math.random() style="cursor:pointer;" title="看不清,点击更换验证码"/>

android联系人中“网站”项字段输入tel:12345678901(冒号后数字大于10位)保存后点击联系人头像,联系人停止运行

1. 新建联系人->网站项输入"tel:012345678901" (冒号后数字大于10位的情况) -> 保存. 2. 进入联系人列表,点击联系人头像 结果: WebAddress.java中抛出异常,程序停止运行 该问题发生的原因是:当在people界面点击某个有网站字段的联系人的quickContact图标时,会检查网站字段的合法性, 如果合法,才会画出quickContactActivity界面,否则会报出ParseException的异常. 找到com/androi

Android更换头像功能实现

现在不管什么APP都有个头像,如果你看见没有头像的APP就会感觉非常奇怪,以前头像都是方的,后来就变成圆的,我估计在过个几年就得来个五角星形状的头像,下面我把更换头像的代码写来: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width

【Android】更换头像的实现

现在不管什么APP都有个头像,如果你看见没有头像的APP就会感觉非常奇怪,以前头像都是方的,后来就变成圆的,我估计在过个几年就得来个五角星形状的头像,下面我把更换头像的代码写来: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width

Laravel5.1 搭建简单的社区(十二)--Ajax更换头像

此篇记录如何使用ajax进行头像的更换,使用ajax需要引入一个jQuery的插件 jQuery form,在app.blade.php中引入: <link rel="stylesheet" href="/css/bootstrap.css"> {{--引入fontawesome--}} <link rel="stylesheet" href="/css/font-awesome.css"> <l

关于更换头像的整个过程理解

之前我遇到一个问题,就是怎样修改头像,都没有更改,后来把某个参数置为null,就解决了问题,但是知其然还要知其所以然,现在还是着重去梳理整个流程 头像,需要关注的是3个变量: 本地地址(方便被调用) 网络地址(方便被调用) 图片文件 接下来,梳理整个过程: 1.新建cropPhoto类,该类主要作用是获取和处理原图片,包括 (1)选择photo 和裁剪 (2)拍照 (3)返回页面处理(被重写) 然后调用拍照或者选择图片,来获取图片来源 2.返回页面处理中,生成临时文件路径和临时文件资源 3.然后

iOS button点击更换图片

我们在做项目时会遇到这样一种情况就是我们要设置一个属性,当点击一次时显示一种效果,再次点击时显示另一种效果,如此反复,这是我们会用到button的一个属性, 那就是isSelected if (self.btnDefaultAddress.isSelected == YES) { [self.btnDefaultAddress setImage:[UIImage imageNamed:@"first_normal.png"] forState:UIControlStateNormal]