文章标题

最新推荐文章于 2022-10-30 12:21:08 发布
最新推荐文章于 2022-10-30 12:21:08 发布
阅读量132 收藏
点赞数
分类专栏： 笔记 文章标签： php-上传图片
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_26071271/article/details/53129813
版权 

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no, minimal-ui">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <script type="text/javascript" src="jquery.3.0.js"></script>
    <title>我要加入</title>
    <style>
        p.tag {
            color: rgb(177, 55, 70);
            margin-bottom: 3px;
            margin-top: 10px;
        }

        form.f_join {
            background-color: white;
            padding: 10px;
            border: 1px solid rgb(204, 204, 204);
            margin-bottom: 20px;
        }

        form.f_join .form-control {
            resize: none;
            margin: 0px;
        }

        .imgupload {
            width: 100%;
            min-height: 100px;
            border: 1px solid rgb(204, 204, 204);
            border-radius: 2px;
            text-align: center;
            position: relative;
        }

        .imgupload input[type=file] {
            /*display:none;*/
            position: absolute;
            opacity: 0.01;
        }

        .imgupload .tip {
            margin-top: 30px;
            font-size: 22px;
            font-weight: 800;
        }

        .imgupload> img {
            width: 100%;
            height: auto;
        }

        .imgupload .tip> .plusico {
            line-height: 1.2;
            height: 26px;
            width: 26px;
            font-weight: 400;
            font-size: 22px;
            border-radius: 20px;
            border: 1px solid rgb(177, 55, 70);
            display: inline-block;
            color: rgb(177, 55, 70);
            margin-right: 4px;
        }
    </style>
    <script>
        $(function() {
            initimginput("iu1");
            initimginput("iu2");
        })

        function initimginput(cid) {
            $("#" + cid).click(function() {
                $(this).children("input[type='file']")[0].click();
            });
            var inputFile = $("#" + cid).children("input[type='file']")[0]; // document.getElementById(inputid),
            var uploadInfo = {};
            inputFile.addEventListener('click', function() {}, false);
            inputFile.addEventListener('change', function(evt) {
                $("#" + cid).children("img").show();
                $("#" + cid).children(".tip").hide();
                evt.stopPropagation();
                evt.preventDefault();
                var file = evt.dataTransfer !== undefined ? evt.dataTransfer.files[0] : evt.target.files[0];
                if(file == null) {
                    $("#" + cid).children(".tip").show();
                    $("#" + cid).children("img").removeAttr("src");
                    $("#" + cid).children("img").hide();
                    return;
                }
                if(!file.type.match(/image.*/)) {
                    return;
                }
                var reader = new FileReader();
                var oImg = $("#" + cid).children("img")[0];
                reader.onload = (function() {
                    return function(e) {
                        uploadInfo.imageBase64 = e.target.result;
                        oImg.src = uploadInfo.imageBase64;
                        var imageObj = new Image();
                        imageObj.src = uploadInfo.imageBase64;
                        // console.log(imageObj.src);
                        $.ajax({
                            url:'http://localhost/upload/demo.php',
                            data:{'value':imageObj.src},
                            type:'post',
                            dataType:'json',
                            success:function(){

                            }
                        });
                    }
                })(file);
                reader.readAsDataURL(file);

            }, false);
        }
    </script>
</head>

<body>
    <div class="container-fluid">
        <div class="row-fluid">
            <p class="tag  fg-red">*隐私保护：本平台会对个人申请者信息保密</p>
            <form class="f_join">
                <div class="form-group">
                    <label for="exampleInputEmail1">机构名称:</label>
                    <input type="text" class="form-control" placeholder="机构名称">
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">统一社会信用代码:</label>
                    <input type="text" class="form-control" placeholder="统一社会信用代码">
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">企业注册号（或登记证号）:</label>
                    <input type="text" class="form-control" placeholder="企业注册号/登记证号">
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">行政许可证号：</label>
                    <input type="text" class="form-control" placeholder="行政许可证号">
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">许可机关</label>
                    <input type="text" class="form-control" placeholder="许可机关">
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">详细地址</label>
                    <input type="text" class="form-control" placeholder="详细地址">
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">联系电话</label>
                    <input type="tel" class="form-control" placeholder="联系电话">
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">组织简介</label>
                    <textarea class="form-control" rows="4" placeholder="组织简介"></textarea>
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">照片上传<span class="fg-red">（请上传营业执照）</span></label>
                    <div class="imgupload" id="iu1">
                        <input type="file" accept="image/*" class="form-control" placeholder="联系电话">
                        <div class="tip">
                            <div class="plusico"> + </div>添加照片</div>
                        <img/>
                    </div>
                </div>
                <div class="form-group">
                    <label for="exampleInputPassword1">照片上传<span class="fg-red">（请上传许可证）</span></label>
                    <div class="imgupload" id="iu2">
                        <input type="file" accept="image/*" class="form-control" placeholder="联系电话">
                        <div class="tip">
                            <div class="plusico"> + </div>添加照片</div>
                        <img/>
                    </div>
                </div>
                <button type="submit" class="btn btn-success btn-block">提交</button>
                <input type="file" accept="image/*" class="form-control" placeholder="AAAAA">
            </form>
        </div>
    </div>
</body>

php文件demo.php

好吃不如饺子
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
python爬虫爬取微信公众号的阅读数、喜爱数、文章标题和链接等信息
weixin_46569877的博客
08-04 9534
python爬取微信公众号
使用POI生成文章标题
Cloud的专栏
09-24 7105
生成文章标题有两种方式，一种是自定义标题，还有一种是使用现有样式来生成，现在网上大部分是第一种方式，但这种方式有很多弊端，我们先来看第一种 第一步，引入依赖 <dependency> <groupId>org.apache.poi</groupId> <artifactId>poi</artifactId> <version>3.9</version> </dependency>
Markdown 跳转到本文章标题
小白学CS
10-30 4691
Markdown 跳转到本文章标题
火车头插件：根据文章标题生成图片；标题生成相关配图
qq_26057339的博客
05-12 1736
本插件可以根据文章标题自动配图；根据文章标题生成一张好看的插图； 插件售价200；不限制ip,不限域名。一次购买终身使用。 没有第三方接口的调用不用担心插件失效。 插件效果： 插件优势： 用户可以自定义文字的颜色 用户可以自定义文字的大小 用户可以自定义图片背景 用户可以自定义图片格式 用户可以自定义图片储存的目录 用户可以自定义图片在文章哪个位置插入 插件分为 火车头插件和服务器接口： 服务器接口负责处理图片和储存图片； 火车头插件处理文章内容 服务器插件有运行环境要求 php 版本低于
RiPro主题文章标题美化教程 WordPress美化教程
03-02
/*文章标题优化*/ .sjblog-avatar {  width: 50px;  float: left; } .sjblog-avatar img {  float: left;  width: 50px;  border-radius: 50%;  margin-right: 20px; } .sjblog-tgroup{ ...
Wordpress自定义函数控制文章标题长度
09-29
主要为大家介绍了Wordpress自定义函数控制文章标题长度,需要的朋友可以参考下
Python3 文章标题关键字提取的例子
01-20
1.读取所有文章标题； 2.用“结巴分词”的工具包进行文章标题的词语分割； 3.用“sklearn”的工具包计算Tf-idf（词频-逆文档率）; 4.得到满足关键词权重阈值的词 结巴分词详见：结巴分词Github sklearn详见：文本...
PHPCMS内容页文章标题添加页码的方法教程
09-29
如何让PHPCMS的内容页标题显示页码呢？让每篇文章的标题都不一样，这样不但提高了网页体验率，同时也可以达到SEO优化的效果，让百度、谷歌等多收录一些。
杭州电子科技大学数据结构(题目).pdf
04-26
杭州电子科技大学，期末考试资料，计算机专业期末考试试卷，试卷及答案，数据结构。
重庆大学 2010-2011(一)模拟电子技术A卷答案.pdf
04-26
重庆大学期末考试试卷，重大期末考试试题，试题及答案
如何创意年会组织形式？.docx
04-26
年会班会资料，节目策划，游戏策划，策划案，策划方案，活动方案，筹办，公司年会，开场白，主持人，策划主题，主持词，小游戏。
基于Django框架的博客系统.zip
04-26
基于Django框架的博客系统.zip
【基于Springboot+Vue的Java毕业设计】校园服务平台项目实战(源码+录像演示+说明).rar
04-26
【基于Springboot+Vue的Java毕业设计】校园服务平台项目实战(源码+录像演示+说明).rar 【项目技术】 开发语言：Java 框架：Spingboot+vue 架构：B/S 数据库：mysql 【演示视频-编号：321】 https://pan.quark.cn/s/8dea014f4d36 【实现功能】 系统可以提供信息显示和相应服务，其管理员增删改查接单员和接单员资料，审核接单员预订订单，查看订单评价和评分，通过留言功能回复用户提问。
财务收入支出凭证3.xlsx
04-26
Excel数据看板，Excel办公模板，Excel模板下载，Excel数据统计，数据展示
PTS技术内含数据集.zip
最新发布
04-26
PTS技术内含数据集.zip
财务助理总结(1).docx
04-26
工作总结，新年计划，岗位总结，工作汇报，个人总结，述职报告，范文下载，新年总结，新建计划。
重庆大学电磁场原理11年考题(A卷).pdf
04-26
重庆大学期末考试试卷，重大期末考试试题，试题及答案
wordpress 改写文章标题
03-20
您可以使用以下代码来改写 WordPress 文章标题： function custom_title( $title ) { $new_title = '新标题'; return $new_title; } add_filter( 'the_title', 'custom_title' ); 将“新标题”替换为您想要的...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值