Artikel ini adalah artikel cermin dari terjemahan mesin, silakan klik di sini untuk melompat ke artikel aslinya.

Melihat: 10764|Jawab: 0

[JavaScript] Berdasarkan Sina@ fungsi contoh sederhana

[Salin tautan]
Diposting pada 28/06/2015 10.15.30 | | |
  1. ////---------------------------------@发布---------------------------//
  2. function textChange(options) {
  3.     var opt = $.extend({
  4.         Content: ''
  5.     }, options);
  6.     var objId = opt.Content;
  7.     var obj = $("#" + objId);
  8.     obj.keydown(function (evt) {
  9.         var k = window.event ? evt.keyCode : evt.which;
  10.         var isChrome = window.navigator.userAgent.indexOf("Chrome") !== -1;
  11.         if (isChrome&&k==16) {
  12.             k=50;
  13.         }
  14.         //为@键值时
  15.         //这里监听输入框的keyup事件
  16.         //不为空 && 不为上箭头或下箭头或回车
  17.         if (k == 50 && evt.shiftKey) {
  18.             buildTip(obj, '');
  19.         }
  20.         else if (k == 13 || k == 38 || k == 40) { //回车
  21.             if ($('#searchresult ul').length > 0) {
  22.                 if (k == 38) { //上箭头
  23.                     $('#searchresult a.searchHover').parent().prev().find("a").addClass("searchHover");
  24.                     $('#searchresult a.searchHover').parent().next().find("a").removeClass("searchHover");
  25.                 } else if (k == 40) { //下箭头
  26.                     $('#searchresult a.searchHover').parent().next().find("a").addClass("searchHover");
  27.                     $('#searchresult a.searchHover').parent().prev().find("a").removeClass("searchHover");
  28.                 } else if (k == 13) { //回车
  29.                     var selContent = $('#searchresult a.searchHover').attr('rname');
  30.                     if (selContent == "" || selContent == undefined) return;
  31.                     var content = selContent + ' ';

  32.                     //移除textarea里面@后面多余数据
  33.                     var pointIndex = getPositionForTextArea(obj[0]);
  34.                     var searchName = "";
  35.                     var atIndex = obj.val().substring(0, pointIndex).lastIndexOf("@", atIndex);
  36.                     obj.val(obj.val().substring(0, atIndex + 1) + obj.val().substring(pointIndex));

  37.                     var newIndex = getPositionForTextArea(obj[0]);
  38.                     setCursorPosition(obj[0], newIndex - (newIndex - atIndex - 1));

  39.                     resetPostion(content, obj);
  40.                     $("#searchresult").remove();
  41.                 }
  42.                 evt.returnValue = false;
  43.                 return false;
  44.             }
  45.         }
  46.         else {
  47.             //$("#searchresult").remove();
  48.         }
  49.     });

  50.     obj.keyup(function (evt) {
  51.         var k = window.event ? evt.keyCode : evt.which;
  52.         if (k != 13 && k != 38 && k != 40) {
  53.             if ($('#searchresult ul').length > 0) {
  54.                 var pointIndex = getPositionForTextArea(obj[0]);
  55.                 var searchName = "";
  56.                 var atIndex = obj.val().substring(0,pointIndex).lastIndexOf("@", atIndex);
  57.                 searchName = obj.val().substring(atIndex + 1, pointIndex);
  58.                 buildTip(obj, searchName);
  59.             }
  60.         }
  61.     });
  62. }

  63. //构建提示信息
  64. function buildTip(obj, serachname) {
  65.     $.ajax({
  66.         type: 'post',
  67.         url: '',
  68.         data: '',
  69.         dataType: 'json',
  70.         success: function (data) {
  71.             var objData = data.list;
  72.             if (objData.length > 0) {
  73.                 if ($("#searchresult").length > 0)
  74.                     $("#searchresult").remove();
  75.                 var layer = "";
  76.                 layer = "<div id='searchresult'><ul>";
  77.                 $.each(objData, function (idx, item) {
  78.                     layer += "<li><a href='javascrip去掉t:void(0);' ></a></li>";
  79.                 });
  80.                 layer += "</ul></div>";

  81.                 //将结果添加到div中
  82.                 obj.after($(layer));
  83.                 $("#searchresult a:first").addClass("searchHover");
  84.                 $("#searchresult").css("display", "");

  85.                 //鼠标点击事件
  86.                 $("#searchresult a").click(function () {
  87.                     var content = $(this).attr('rname') + ' ';
  88.                     resetPostion(content, obj);
  89.                     $("#searchresult").empty();
  90.                     $("#searchresult").css("display", "none");
  91.                 });

  92.                 $("#searchresult a").each(function () {
  93.                     $(this).mouseover(function (e) {
  94.                         $("#searchresult a").removeClass("searchHover");
  95.                         $(this).addClass("searchHover");
  96.                     });
  97.                 });

  98.                 //evt.stopPropagation();

  99.                 //处理js事件冒泡问题
  100.                 $('body').bind("click", function (e) {
  101.                     $("#searchresult").remove();
  102.                     e.stopPropagation();
  103.                 });
  104.                 $("#searchresult").bind("click", function (e) {
  105.                     e.stopPropagation();
  106.                 });

  107.             } else {
  108.                 $("#searchresult").remove();
  109.             }
  110.         }
  111.     });
  112. }

  113. var cpos = 0;
  114. function resetPostion(content, target) {
  115.     var tc = target[0];

  116.     if (document.selection) {//ie
  117.         target.bind("click keyup", function (e) {//点击或键盘动作时设置光标值
  118.             e.stopPropagation();
  119.             cpos = getPositionForTextArea(tc);
  120.         });
  121.     }
  122.     var tclen = target.val().length;
  123.     var pos = 0;
  124.     if (typeof document.selection != "undefined") {//IE
  125.         target.focus();
  126.         //setCursorPosition(tc, cpos);//设置焦点
  127.         document.selection.createRange().text = content;
  128.         //计算光标位置
  129.         pos = getPositionForTextArea(tc);
  130.     } else {//火狐
  131.         //计算光标位置
  132.         pos = tc.selectionStart + content.length;
  133.         target.val(target.val().substr(0, tc.selectionStart) + content + target.val().substring(tc.selectionStart, tclen));
  134.     }
  135.     cpos = pos;
  136.     setCursorPosition(tc, pos); //设置焦点
  137. }

  138. //textarea设置光标位置
  139. function setCursorPosition(ctrl, pos) {
  140.     if (ctrl.setSelectionRange) {
  141.         ctrl.focus();
  142.         ctrl.setSelectionRange(pos, pos);
  143.     } else if (ctrl.createTextRange) {// IE Support
  144.         var range = ctrl.createTextRange();
  145.         range.collapse(true);
  146.         range.moveEnd('character', pos);
  147.         range.moveStart('character', pos);
  148.         range.select();
  149.     }
  150. }

  151. //获取多行文本框光标位置
  152. function getPositionForTextArea(obj, content) {
  153.     var CaretPos = -1;
  154.     if (typeof document.selection != "undefined") {//IE
  155.         var Sel = document.selection.createRange();
  156.         var Sel2 = Sel.duplicate();
  157.         Sel2.moveToElementText(obj);
  158.         while (Sel2.inRange(Sel)) {
  159.             Sel2.moveStart('character');
  160.             CaretPos++;
  161.         }
  162.     }
  163.     else {
  164.         if (content == undefined)
  165.             content = "";
  166.         CaretPos = obj.selectionStart + content.length;
  167.     }
  168.     return CaretPos;

  169. }
Salin kode






Mantan:Highcharts menggabungkan Asp.net untuk mewujudkan contoh tampilan grafik stok data dinamis
Depan:Validasi Data MVC
Sanggahan:
Semua perangkat lunak, materi pemrograman, atau artikel yang diterbitkan oleh Code Farmer Network hanya untuk tujuan pembelajaran dan penelitian; Konten di atas tidak boleh digunakan untuk tujuan komersial atau ilegal, jika tidak, pengguna akan menanggung semua konsekuensi. Informasi di situs ini berasal dari Internet, dan sengketa hak cipta tidak ada hubungannya dengan situs ini. Anda harus sepenuhnya menghapus konten di atas dari komputer Anda dalam waktu 24 jam setelah pengunduhan. Jika Anda menyukai program ini, harap dukung perangkat lunak asli, pembelian pendaftaran, dan dapatkan layanan asli yang lebih baik. Jika ada pelanggaran, silakan hubungi kami melalui email.

Mail To:help@itsvse.com