霍梦林的个人博客

清除ios上button和input的默认样式

时间：2017年09月25日
项目：《金银屋官网》
问题：表单样式在 iOS 手机上不兼容
描述: 按钮和 input 输入框在 iOS 上有默认样式，没有去掉
代码： 
input[type=button],input[type=text],input[type=password] {
  -webkit-appearance:none;outline:none
}

时间：2017年09月25日
项目：《金银屋官网》
问题：代码意图和逻辑没理清楚

(function bottonm(){
    if($(document).height()<$(window).height()){
        $('.model-close').css({'position':'fixed','bottom':'20px'});
        $(document).height($(window).height()+'px');
    }
})();

$('.model-close') 是关闭弹出框表单的按钮，不会直接显示在页面，这段代码在 js 文件加载完就立即执行，没有任何意义，反而导致 JS 报错

时间：2017年09月25日
项目：《金银屋官网》
问题：不注意代码风格，没有遵守编码规范；有的代码加了分号有的没加；不该缩进的地方有缩进；同时使用了双引号和单引号；

问题代码 1：

success: function(resp) {
  if (resp.retcode === 2000000) {
    successshow.show()
    event.stopPropagation()
  } else {
    util.Alert('提示', resp.msg)
  }
},
error:function(xhr,type) {
  failshow.show()
  event.stopPropagation();
}

问题代码 2 (同时使用了双引号和单引号):
$("#applycode").on('keyup',function(e){

时间：2017年09月25日
项目：《金银屋官网》
问题：提交信息写错，deploy 写成 delply

commit 018461f1029d44543e69ce9f902d77170b1939e0
Author: MOMO-0902 <329053928@qq.com>
Date:   Mon Sep 25 06:54:29 2017 +0800

    修改delply以及部分样式

使用display:table实现移动端垂直居中

时间：2017年09月25日
项目：《金银屋官网》
问题：移动端line-height也不能实现准确垂直居中，字体整体靠上
描述：移动端与pc端解析方式不一样，导致line-height出现偏差
解决办法：使用display:table解决问题

问题2：使用display:table后本来不一样的两个元素变的一样高
描述：这是因为display:table是将子元素变成单元格一样的显示方式，所以是等高的
解决办法：给高度较小的盒子外边套一层，再使用vertical-align:middle 实现垂直居中
//父元素
.step{
  display: table;
  height: 20px;
}
//子元素1显示数字
.stepnum {
  display:table-cell;
  vertical-align: middle;
}
//子元素2显示文字
.stepword {
  display:table-cell;
  vertical-align: middle;
  font-size: 14px;
}
//显示数字，是stpmnum的子元素
.number {
  font-size: 12px;
  height: 16px;
}

使用select.val()来获取select选中项的value值

时间：2017年09月26日
项目：《金银屋官网》
问题：未选择房产和金额的时候点击提交按钮，报错 Cannot read property 'value' of undefined

let houseoptions = $(".select-house option").not(function(){ return !this.selected })
var house = houseoptions[0].value

这段代码是想获取 select选中的option，然后再获取 option的value值，给select设置没有默认选中项，所以当没有手动选择一项就点提交，option的value值也是没有的

解决办法：使用select.val()来获取select选中项的value值

select的value()方法 和 text()方法

时间：2017年09月26日
项目：《金银屋官网》
问题：未正确分清select option的value和text值
描述：使用select.val()获取 选中项的value值
      option的value值是要发送到服务器的值
      select.text()获取所有option的值
      option的text值是option的显示内容

引入库版本过低

时间：2017年09月26日
项目：9.14-9.19一周学习分享
问题：使用click与tap事件报错
描述：由于zepto的touch.js版本过低，导致引入后页面发生事件报错

jquery ajax格式

时间：2017年09月26日
项目：9.14-9.19一周学习分享
问题1：写ajax格式出错
描述：$.ajax({}) 写成了 $(ajax).({})
     $(“html元素”)，$相当于Jquery，意思是选取，查询，或创建页面中的一个或者一类html元素，并对它们进行操作
     $.ajax({}) $.each({}) $.map({})  $作为功能函数的前缀，意为调用(.)jquery对象($)的方法(ajax), $(ajax)是利用选择器获取元素，所以并不能在后边加"."

问题2：使用ajax传送数据与接收参数类型搞错
描述：向服务器传送数据应该是data,不是dataType,dataType是期待服务器返回类型，contentType是发送到服务器类型一般为"application/json"
$.ajax({
  url: "http://www.baidu.com",
  data: {"username":username, "password":password},
  dataType: "json",
  contentType: "application/json",
  timeout: 3000,
  content: "$("body"),
  success: function() {},
  error: function() {}
  })

markdown h1-h6下边加空行

时间：2017年09月27日
项目：《wiki》写笔记
问题：第二个##没有h2的样式
描述：没有给h2下边加一空行，导致h2跟正文样式一样

jquery回调函数

问题：网页文档加载后的事件不执行
时间：2017.09
描述：第一次写的时候丢了function，这段代码的意思是当页面加载完成后执行此函数里边的函数，所以function(){}不能丢
解决办法：
$(document).ready(function(){
function Func(){}
})

zepto获取select元素选中值

问题：使用$('option[selected]')不能获取slection选中的option值
描述：zepto获取select元素的选中option不能用类似jq的方法$('option[selected]'),因为selected属性不是css的标准属性
解决办法：使用$('option').not(function(){ return !this.selected })
比如：jq:$this.find('option[selected]').attr('data-v') * 1
zepto:$this.find('option').not(function() {return !this.selected}).attr('data-v') * 1
但是获取有select中含有disabled属性的元素可以用$this.find("option:not(:disabled)")因为disabled是标准属性

← 201710 →

<<<<<<< HEAD ======= <<<<<<< HEAD ======= >>>>>>> 793eb5d4d6fce8bc79f8be300bf90561aa0235d8 >>>>>>> e8dc1f41ef0284cf252dbb410d298e4600ff4ddb