Rumah > hujung hadapan web > tutorial js > Borang jQuery yang mudah dikendalikan plug-in_jquery segera

Borang jQuery yang mudah dikendalikan plug-in_jquery segera

WBOY
Lepaskan: 2016-05-16 15:28:28
asal
1049 orang telah melayarinya

Contoh dalam artikel ini menerangkan pemalam segera bentuk ringan---jQuery Form Toolltip. Kongsikan dengan semua orang untuk rujukan anda. Butirannya adalah seperti berikut:

Petua Alat Borang jQuery Ciri:

  • Anda boleh menyesuaikan gaya CSS maklumat segera secara individu.
  • Anda boleh menentukan arah pudar masuk dan keluar pada masa ini, Atas, Bawah, Kanan dan Kiri disokong

Tangkapan skrin kesan berjalan adalah seperti berikut:

Kod khusus adalah seperti berikut:

contoh jquery: Cara menggunakan Petua Alat Borang jQuery
Memperkenalkan fail teras

<script src="js/jquery/2.1.1/jquery.min.js"></script>
<script src="src/jquery.formtooltip.js"></script>
Salin selepas log masuk

Bina html

<form id="formname">
 <table>
  <tr>
   <td> Title </td>
   <td><input type="text" value="blank" name="title"/></td>
  </tr>
  <tr>
   <td> Name </td>
   <td><input type="name" value="Blank Name" name="name"/></td>
  </tr>
  <tr>
   <td> Color </td>
   <td><input type="color" value="#000FFF" name="color"/></td>
  </tr>
  <tr>
   <td> TextArea </td>
   <td><textarea type="month" value="" name="text"></textarea></td>
  </tr>
 </table>
</form>
Salin selepas log masuk

Tulis permulaan JS

$(document).ready(function(){
  var fields = {      
      title: {
        tooltip : "This field is actually for bla bla bla...</br>and bla bla bla",
        position: 'bottom'
      },
      name : {
        tooltip: "This is for fun!!!!", //提示的信息
        position: 'right',       //动画的方向
        backgroundColor: "#FF0000",  //背景颜色
        color: '#FFFF00'        //字体颜色
        },
      color : {
        tooltip: "This is for your cover color~~~<a href='#'>here</a>"
        },
      text : {
        tooltip: "Please provide your comment here."
        }
      };
 
  //Include Global Color 
  $("#formname").formtoolip(fields, { backgroundColor: "#000000" , color : "#FFFFFF", fontSize : 15, padding : 10, borderRadius : 5});     
});
Salin selepas log masuk

Tentukan tatasusunan medan, tulis medan borang yang perlu digesa mengikut turutan, dan kemudian panggil fungsi formatoolip untuk memulakan.

Di atas ialah pemalam petua alat borang jQuery yang dikongsi dengan anda: Petua Alat Borang jQuery , ia sangat praktikal, saya harap anda menyukainya.

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan