jquery 的一些基本操做

時間 2019-12-08

標籤 jquery 一些基本欄目 JQuery 简体版

原文原文鏈接

平常使用中的操做記錄，持續更新中：html

jquery.form.js表單ajax提交設置

var options = {
                //target: '#input',          //把服務器返回的內容放入id爲input的元素中      
                beforeSubmit: function () { },  //提交前的回調函數  
                success: function (data) { },      //提交後的回調函數  
                //url: url,                 //默認是form的action， 若是申明，則會覆蓋  
                //type: type,               //默認是form的method（get or post），若是申明，則會覆蓋  
                //dataType: null,           //html(默認), xml, script, json...接受服務端返回的類型  
                //clearForm: true,          //成功提交後，清除全部表單元素的值  
                //resetForm: true,          //成功提交後，重置全部表單元素的值  
                //timeout: 3000               //限制請求的時間，當請求大於3秒後，跳出請求  
            };
//表單校驗
$('#form').validate({
          errorLabelContainer: $("div.error-container"),
          submitHandler: function (form) {
          //校驗完成提交表單
          $(form).ajaxSubmit(contact_options);
          }
});

計算兩個時間之間相差的年份、月份、天數、小時、分鐘、秒jquery

function getDateDiff(dateTimeStamp) {
  var nowtime = new Date();//當前系統時間
  //兩時間差爲毫秒數，除以1000則轉換爲秒數
  var leftsecond = parseInt(Math.abs((dateTimeStamp.getTime() - nowtime.getTime())) / 1000);
  dayC = parseInt(leftsecond / (60 * 60 * 24));//計算出相差天數
  yearsC = parseInt(dayC / 365);//根據天數計算年份
  monthC = (nowtime.getFullYear() * 12 + nowtime.getMonth()) - (dateTimeStamp.getFullYear() * 12 + dateTimeStamp.getMonth());//計算月份
  hourC = parseInt((leftsecond / 3600) % 24);//扣除相差天數，計算出相差小時數
  minC = parseInt((leftsecond / 60) % 60);//扣除相差天數，小時數，計算出相差分鐘數
  s = parseInt(leftsecond % 60);//扣除相差天數、小時數、分鐘數相差數，計算出相差秒速
  if (yearsC >= 1) {
      result = "" + yearsC + "年前";
  }
  else if (monthC>1) {
     result = "" + monthC + "月前";
  }
  else if (dayC >= 1) {
     result = "" + dayC + "天前";
  }
  else if (hourC >= 1) {
     result = "" + hourC + "小時前";
  }
  else if (minC >= 1) {
     result = "" + minC + "分鐘前";
  } else
     result = "剛剛";
  return result;
}

禁用表單提交：git

$("#frm").submit(function (e) {
    e.preventDefault();
});

ECharts，一個純 Javascript 的圖表庫，能夠流暢的運行在 PC 和移動設備上，兼容當前絕大部分瀏覽器（IE8/9/10/11，Chrome，Firefox，Safari等），底層依賴輕量級的 Canvas 類庫 ZRender，提供直觀，生動，可交互，可高度個性化定製的數據可視化圖表。github

官網地址：http://echarts.baidu.com/index.htmlweb

indexOf() 方法可返回某個指定的字符串值在字符串中首次出現的位置。ajax

lastIndexOf() 方法可返回一個指定的字符串值最後出現的位置，在一個字符串中的指定位置從後向前搜索。json

// 判斷字符串中是否存在該字符 存在返回字符位置 不存在返回-1
 var test= ",1,";
 test.indexOf("," +test+ ",") != -1
 
// 截取指定位置以後的全部數據
 var _st_pwd = user_pwd.substring(user_pwd.indexOf('+'));
    
// 從0 開始截取到指定位置
 var _s_pwd = user_pwd.substring(0, user_pwd.lastIndexOf('+'));

獲取表格 td的值獲取表格第一行第二列的值c#

$("#table tr td").eq(1).text()

按鈕倒計時：數組

 function countdown(s, sendObj) {
     s--;
     if (s == 0) {
         sendObj.innerHTML = '發送驗證碼';
        } else {
          sendObj.innerHTML = s + '秒後可重發';
          setTimeout(function () {
          countdown(s, sendObj)
      }, 1000)
   }
}

禁用按鈕：瀏覽器

//禁用按鈕
$('#buttonSelect').attr("disabled", true);  
//移除禁用
$('#buttonSelect').attr("disabled", false);

頁面不刷新加載新頁面

function jumpPage(url) {
    var pageContentBody = $('.content-wrapper');
    $.ajax({
        type: "GET",
        cache: false,
        url: url,
        dataType: "html",
        success: function (res) {
            if (res == '"needlogin"') {
                window.location.href = "/home/login";
            } else {
                if (typeof window.bmshistory != "undefined") {
                    var i = window.bmshistory.indexOf(url);
                    if (i != -1) {
                        window.bmshistory.splice(i, 1);
                    }
                    if (window.bmshistory.length > 10) {
                        window.bmshistory.shift();

                    }
                    window.bmshistory.push(url);

                }
                else {
                    window.bmshistory = [];
                    window.bmshistory.push(url);
                }
                pageContentBody.html(res);
            }
        },
        error: function (xhr, ajaxOptions, thrownError) {
            pageContentBody.html('<h4 style="font-family:Microsoft YaHei;">訪問服務器鏈接故障,請檢查網絡...</h4>');
            //App.unblockUI(pageContent);
        },
        async: false
    });
}

js全選操做

  $("#checkAll").on("click", function () {
            if (this.checked) {
                $("input:checkbox[name='checkvideo']").prop("checked", true);
            } else {
                $("input:checkbox[name='checkvideo']").prop("checked", false);
            }
        });

jquery下載文件

 var content = "file content!";
                    var data = new Blob([content], { type: "text/plain;charset=UTF-8" });
                    var downloadUrl = window.URL.createObjectURL(data);
                    var anchor = document.createElement("a");
                    anchor.href = downloadUrl;
                    anchor.download = "文件名.txt";
                    anchor.click();
                    window.URL.revokeObjectURL(data);

c# ajax提交html時報錯解決辦法

首先在默認狀況下標籤類的東西是不會讓你提交的這是出於.net 的默認安全機制

咱們要先在 <%@ page %> 裏邊加上 ValidateRequest="false"

這個時候若是仍是不能提交到後臺那你就得修改一下 web.config 了

添加以下節點

<system.web>
<httpRuntime requestValidationMode="2.0"/>
</system.web>

append() – 在指定的元素的尾部添加一個新內容。

prepend() -在指定的元素裏前部添加新內容。

after() – 在指定元素前添加新內容

before() -在指定元素的後面添加新內容。

乍一看append,prepend 和after,before彷佛功能同樣，但append,prepend指在選中的元素自己（內部）的前面和後面，而after,before指在選擇中的元素的前面和後面。

js獲取瀏覽器地址中的參數：

例如：http://172.16.41.106:8081/signIn/details?userId=8f9e04d4bb784542abdf3debe5ca0a9a

function getQueryString(name) {
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr(1).match(reg);
if (r != null) return unescape(r[2]); return null;
}
$(document).ready(function(){
var page=getQueryString("userId");
})

時間戳轉換：

    //時間戳轉換
    function dataTime(time) {
        // 好比須要這樣的格式 yyyy-MM-dd hh:mm:ss
        var _date = new Date(time), year = _date.getFullYear(), //年
        month = _date.getMonth() + 1, //月
        day = _date.getDate(), //日
        hour = _date.getHours(), //時間
        minute = _date.getMinutes(), //分鐘
        second = _date.getSeconds();//秒
        return year + "-" + month + "-" + day + " " + hour + ":" + minute;
    }

c# 時間戳轉換實例：/Date(1521993600000)/

 var c = date.replace("/Date(", "").replace(")/", "");
 var now = new Date(parseInt(c));
 var year = now.getFullYear();
 var month = now.getMonth() + 1;
 var day = now.getDate();
 var hour = now.getHours();
 var minute = now.getMinutes();
 var second = now.getSeconds();
 return year + "-" + (month < 10 ? "0" + month : month) + "-" + (day < 10 ? "0" + day : day) + "   " + (hour < 10 ? "0" + hour : hour) + ":" + (minute < 10 ? "0" + minute : minute) + ":" + (second < 10 ? "0" + second : second);

數組字符串轉數組：

var images="["2016-11-22\/f22faadc-9b45-49c5-ace9-e77fbfbcc86b.jpg","2016-11-22\/28929bc2-a865-45c8-aa0b-0584408e1ed3.jpg"]";
//第一種解析方式
var img=eval(images);
//第二種解析方式
var img=JSON.parse(images);

獲取select下拉列表框當前選中的值

$("#列表框的id").val();

獲取select當前選中的文本值

$("#下拉列表框的id").find("option:selected").text();

對象轉json json轉對象

//將對象轉換爲json
var js=JSON.stringify(jsonStr); 

//解析json
 var obj = eval(agent.houseImgs);

//自定義json對象
var js {"name":$(name).val(),"phone":$(phone).val(),"carNumber":$(carNumbers).val(),"remark":remark, "imgurl":imgurl};
//初始化數組
var aArray=new Array();
//賦值
 aArray.push(jsonObj);

js 60秒倒計時

 //60秒計時
    var countdown = 60;
    function SendEmail(obj) {
        if (countdown == 0) {
            obj.removeAttribute("disabled");
            obj.value = "獲取驗證碼";
            countdown = 60;
            return;
        } else {
            obj.setAttribute("disabled", true);
            obj.value = "從新發送(" + countdown + ")";
            countdown--;
        }
        setTimeout(function () {
           //SendEmail(obj)
        }, 1000)

    }

清空表單數據

 function ResertForm() {
        $(':input', '#signupForm')
            .not(':button, :submit, :reset, :hidden')
            .val('')
            .removeAttr('checked')
            .removeAttr('selected');
    }

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。