JS前端随笔小记

随意更改网页内容

document.body.contentEditable="true"

获取点击处附近的值

<div class="input-group ebs-modal-choose">
     <input name="username" value="${item.bidPrice}">
     <div class="input-group-addon">
        <span class=" btn-default selectPrice">
          <i class="epsicons icon-select1"></i>
        </span>
    </div>
</div>

点击span按钮时获取input中的值

 $(document).on('click', '.selectPrice',function(){
     var username= $(this).parent().parent().find("input[name='username']").val();
});

this 对象指的是点击的span标签对象，第一个parent获取到它的父级div对象，再通过parent获取div的父级对象div，在获取此div下面input对象的值。

禁止a标签点击

<a class="disable">pibigstar</a>

.disable{
  pointer-events:none;
}

输出横竖表格

<table id="priceTable" class="table scroll table-bordered" border="1">
     <tbody id="priceTbody">
      <tr>
          <td></td>
          <c:forEach items="${srModel.levelInfos}" var="levelInfo">
             <td>${levelInfo}</td>
          </c:forEach>
      </tr>
      <c:forEach items="${srModel.itemInfos}" var="itemInfo">
         <tr>
            <td>${itemInfo}</td>
            <c:forEach items="${srModel.levelInfos}" var="levelInfo">
              <td>
                <input name="price" >
              </td>
          </c:forEach>
         </tr>
      </c:forEach>
      </tbody>
  </table>

遍历数组

var content = ["1","2","3"];
$.each(content, function(i,item){
	console("下标："+ i +"值："+item);
})

对象转JSON

var data = [];
data[0] = new Object();
data[0].id = 1;
data[0].name = "pibigstar";
var str = JSON.stringify(data);
[{"id":"1","name":"pibigstar"}]

新增/删除CSS样式

$("#itemDiv").removeClass("hidden");
$("#itemDiv").addClass("hidden");

获取点击处在此列表中的位置

 $(document).on('click','.deleteItemBtn',function() {
     var currentCell =$("#myUl li").index(this) + 1;
})