jQuery prompt plug-in alertify penggunaan guide_jquery

1. maklumkan fungsi pemalam

Terutamanya melaksanakan fungsi gesaan, yang digunakan untuk menggantikan makluman, mengesahkan, gesaan dalam js dan memaparkan kotak gesaan mesra

2. Cara menggunakan alertify

1. Fail digunakan
Terutamanya gunakan tiga fail dan dua css (alertify.core.css, alertify.default.css) untuk menetapkan gaya kotak gesaan. Js (alertify.min.js atau alertify.js), digunakan untuk melaksanakan fungsi kotak gesaan.

2. Laksanakan kod kotak gesaan
Alertif adalah sangat mudah untuk digunakan Langkah-langkah utama ialah: permulaan (mulakan alertify) -> mengikat (peristiwa mengikat)

Seperti melaksanakan kotak gesaan ringkas, kotak pengesahan dan kotak gesaan

var
$ = function (id) {
  return document.getElementById(id);
},
//初始化操作
reset = function () {
  alertify.set({
    labels : {
      ok   : "确认",
      cancel : "取消"
    },
    delay : 5000,
    buttonReverse : false,
    buttonFocus  : "ok"
  });
};
//绑定
$("alert").onclick = function () {
   reset();
   alertify.alert("提示框");
   return false;
};
//绑定
$("confirm").onclick = function () {
   reset();
   alertify.confirm("确认框", function (e) {
     if (e) {
       alertify.success("点击确认");
     } else {
       alertify.error("点击取消");
     }
   });
   return false;
};
//绑定
$("prompt").onclick = function () {
  reset();
  alertify.prompt("提示输入框", function (e, str) {
    if (e) {
      alertify.success("点击确认，输入内容为: " + str);
    } else {
      alertify.error("点击取消");
    }
  }, "默认值");
  return false;
};

Paparkan hasil (kotak gesaan input):

4. maklumkan ubah suai gaya
Ia terutamanya mengubah suai dua fail css (alertify.core.css, alertify.default.css), yang juga boleh ditimpa. Jika anda menambah

pada halaman

.alertify{
  width:350px;
  margin-left: -205px;
  border:2px solid #4ba9e6;
  background:#f3faff;
  border-radius:0;
}

Paparkan hasil selepas pengubahsuaian:

maklumkan arahan penggunaan

alertify ialah pemalam yang dibangunkan oleh html5 css3, jadi ia menyokong penyemak imbas html5 css3 dengan sempurna. Semasa proses ujian, kesan paparan alertify adalah sempurna dalam penyemak imbas Chrome dan Firefox, tetapi dalam IE8, kesan paparan berbeza, seperti sudut bulat, bayang-bayang, kesan khas animasi, dll. tidak akan dipaparkan.

Di atas adalah keseluruhan kandungan artikel ini, saya harap anda semua menyukainya.