<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <link rel="stylesheet" type="text/css" href="css/swiper-3.4.2.min.css" /> <link rel="stylesheet" type="text/css" href="css/init.css" /> <link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_647640_to180rktm1butyb9.css" /> <link rel="stylesheet" type="text/css" href="css/research.css" /> <link rel="stylesheet" type="text/css" href="css/myweui.css"/> <link rel="stylesheet" type="text/css" href="css/weui.css"/> <script src="js/base.js" type="text/javascript" charset="utf-8"></script> <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script> <script src="js/myweui.js" type="text/javascript" charset="utf-8"></script> <script src="js/weui.js" type="text/javascript" charset="utf-8"></script> <title>调研引导</title> <style> [v-cloak]{ display:none; } </style> </head> <body> <div class="container" id="research" v-cloak> <!--遮罩--> <div class="wrap hidden" v-if="success"> </div> <!--弹层--> <div class="popup" v-if="success"> <img src="img/圆角矩形6@2x.png" class="take_btn" @click="recivecompoun()"/> <div class="popup_h"> <span class="line"></span> <span class="radius"></span> <p class="success">挑战成功</p> <span class="radius"></span> <span class="line"></span> </div> <p class="congratulation">恭喜你成为小吃代言人</p> <i class="iconfont icon-close"></i> </div> <!--文本编辑区--> <div class="edit"> {{part1}} </div> <!--第一问--> <div class="question"> <div class="question_item"> <div class="question_tit"> <span class="question_num">1</span><span class="question_tit_text">{{question0.title}}</span> </div> <p class="question_text">{{question0.content}}</p> <div class="question_answer"> <span class="active product_type" @click="select1()">北舞渡</span><span class="product_type" @click="select2()">逍遥镇</span><span class="product_type" @click="select3()">方中山</span> </div> </div> <!--第二问--> <div class="question_item"> <div class="question_tit"> <span class="question_num">2</span><span class="question_tit_text">{{question1.title}}</span> </div> <p class="question_text">{{question1.content}}</p> <div class="question_answer_choose"> <span class="question_answer_choose_num" @click="fre()">{{frequency}} ><span></span></span> </div> </div> <!--第三问--> <div class="question_item"> <div class="question_tit"> <span class="question_num">3</span><span class="question_tit_text">{{question2.title}}</span> </div> <div class="question_item_wrap"> <p class="question_text">{{question2.content}}</p> <div class="question_answer_arr"> <!--<span class="question_answer_item">省 ><span></span></span> <span class="question_answer_item">市 ><span></span></span> <span class="question_answer_street"><p>区县</p> ></span> <span class="question_answer_street"><p>街道</p> ></span> <!--<span class="question_answer_item_details">详细地址<span>--> <!--<input type="text" style="border:none;outline:none" class="question_answer_item_details" placeholder="详细地址"/>--> <select class="question_answer_item" v-on:change="selectcity($event.target)" style="font-size:0.26rem;border:none;outline:none;width:1.6rem;" v-model="proce"> <!--<option value="" style="font-size:0.26rem">省</option>--> <!--<option disabled value="">请选择</option>--> <option value="" style="font-size:0.26rem" v-for="item in province" :value="item">{{item.province_name}}</option> </select> <select class="question_answer_item" v-on:change="selectcounty($event.target)" style="font-size:0.26rem;border:none;outline:none;width:1.6rem;" v-model="ci"> <!--<option value="" style="font-size:0.26rem">市</option>--> <option :value="item" style="font-size:0.26rem" v-for="item in city">{{item.city_name}}</option> </select> <select class="question_answer_item" v-on:change="selectstreet($event.target)" style="font-size:0.26rem;border:none;outline:none;width:1.6rem;" v-model="coun"> <!--<option value="" style="font-size:0.26rem">区</option>--> <option style="font-size:0.26rem" :value="item" v-for="item in county">{{item.county_name}}</option> </select> <select class="question_answer_item" style="font-size:0.26rem;border:none;outline:none;width:1.6rem;" v-on:change="select($event.target)" v-model="stre"> <!--<option value="">街道</option>--> <option :value="item" style="font-size:0.26rem" v-for="item in street">{{item.town_name}}</option> </select> <input class="question_answer_item_details" style="border:none;outline:none" v-model="detailaddress" placeholder="详细地址"> </div> </div> </div> <!--第二问--> <div class="question_item"> <div class="question_tit"> <span class="question_num">2</span><span class="question_tit_text">{{question3.title}}</span> </div> <div class="question_item_wrap"> <div class="question_item_home"> <span class="question_item_home_text">{{question3_title1}}</span> <!--<span class="question_answer_street"><p>省市</p> ></span> <span class="question_answer_item">市 ><span></span></span> <span class="question_answer_street"><p>区县</p> ></span>--> <select class="question_answer_item" style="font-size:0.26rem;border:none;outline:none;width:1.2rem;margin-right: 0;" v-on:change="selfprove($event.target)" v-model="selfpro" > <!--<option value="" style="font-size:0.26rem" >省</option>--> <option value="" style="font-size:0.26rem" :value="item" v-for="item in selfprovince">{{item.province_name}}</option> </select> <select class="question_answer_item" style="font-size:0.26rem;border:none;outline:none;width:1.2rem;margin-right: 0;" v-on:change="selfci($event.target)" v-model="selfc"> <!--<option value="" style="font-size:0.26rem">市</option>--> <option value="" style="font-size:0.26rem" :value="item" v-for="item in selfcity" >{{item.city_name}}</option> </select> <select class="question_answer_item" style="font-size:0.26rem;border:none;outline:none;width:1.2rem;margin-right: 0;" v-on:change="selfcou($event.target)" v-model="selfcoun"> <!--<option value="" style="font-size:0.26rem">区</option>--> <option value="" style="font-size:0.26rem" :value="item" v-for="item in selfcounty">{{item.county_name}}</option> </select> <span class="question_item_home_text" style="margin-left: 0.2px;">{{question3_title2}}</span> </div> <div class="favorite_food"> <span>{{question3_title3}}</span><input type="textbox" v-model="food"/> </div> </div> </div> </div> <!--footer--> <div class="footer"> <span @click="sure()">挑战完成</span> </div> </div> <script src="js/vue.min.js" type="text/javascript" charset="utf-8"></script> <script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script> <script src="js/cookie.js" type="text/javascript" charset="utf-8"></script> <script src="js/swiper-3.4.2.jquery.min.js" type="text/javascript" charset="utf-8"></script> <script src="js/research.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> var footer = document.getElementsByClassName('footer')[0]; var icon_close = document.getElementsByClassName('icon-close')[0]; var popop = document.getElementsByClassName('popup')[0]; var wrap = document.getElementsByClassName('wrap')[0]; var product_type = document.getElementsByClassName('product_type'); //第一问 for(i = 0; i < product_type.length; i++) { product_type[i].onclick = function() { for(j = 0; j < product_type.length; j++) { product_type[j].classList.remove('active'); } this.classList.add('active'); } } // 第二问 // var ageArr = []; // for(let n = 0; n < 8; n++) { // var st = { // label: n + '次',/**/ // value: n, // } // ageArr.push(st); // } // $(".question_answer_choose").click(function() { // weui.picker(ageArr, { // className: 'custom-classname', // container: 'body', // defaultValue: [3], // onChange: function(result) {}, // onConfirm: function(result) { // console.log(result) // $('.question_answer_choose_num').html(result[0].label) // }, // id: 'singleLinePicker' // }); // }) icon_close.onclick = function() { popop.style.display = 'none'; wrap.style.display = 'none'; } footer.onclick = function() { popop.style.display = 'block'; wrap.style.display = 'block'; } </script> </body> </html>