additionWord.js 6.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181
  1. $(function(){
  2. $('.knowBtn').on('click',function(){
  3. $(".problemPop").hide()
  4. })
  5. $(".problem").on('click',function(){
  6. $(".problemPop").css("display",'flex');
  7. })
  8. function hasWords () {
  9. var showKeyWordLength = $(".showKeyWord ul").find('li').length;
  10. if(showKeyWordLength === 0){
  11. $(".addkeyWord").show();
  12. $('.addKeyWord').hide();
  13. } else {
  14. $(".addkeyWord").hide();
  15. $('.addKeyWord').show();
  16. }
  17. }
  18. hasWords()
  19. // 添加按钮
  20. $(".addKeyWord i").on('click',function(){
  21. $(".addkeyWord").show();
  22. $(".addKeyWord").hide();
  23. $(".addkeyWord input").focus();
  24. $('.showKeyWord').find('.one').show();
  25. $('.showKeyWord').find('.modify').hide();
  26. })
  27. // 输入框自适应高度
  28. $('textarea').each(function(i,dom){
  29. // console.log(i,dom)
  30. dom.style.height = dom.scrollHeight +'px';
  31. })
  32. $("textarea").on("input", function() {
  33. this.style.height = 'auto';
  34. this.style.height = this.scrollHeight + "px";
  35. })
  36. // 添加keyWords检查输入框内是否有文字,如果有才能点击添加按钮
  37. $('.addkeyWord input.enterOne').on('input', function() {
  38. var buttonDOM = $(this).siblings().find('button')[1]
  39. if ($(this).val().length >= 1) {
  40. buttonDOM.style.opacity = 1
  41. buttonDOM.removeAttribute("disabled")
  42. } else {
  43. buttonDOM.style.opacity = .5
  44. buttonDOM.setAttribute("disabled", true)
  45. }
  46. })
  47. // 添加 按钮的点击事件
  48. $('.addkeyWord .btn button:nth-child(2)').on('click', function(){
  49. var timestamp = new Date().getTime();//动态生成不同的id,因为id唯一不能重复,所以 用时间戳 代替 防止重复
  50. var keyWord = $('.addkeyWord input.enterOne').val();
  51. if(keyWord==""){
  52. return
  53. }
  54. _addindex = 0;
  55. if($(".showKeyWord li").length>0){
  56. _addindex = Number($(".showKeyWord li:first").find(".editKeyWord").attr("dataIndex")) + Number(1);
  57. }
  58. if(addkws_arr[keyWord]!=undefined){
  59. weui.toast('您设置的附加词已存在,请调整后再添加。', {
  60. duration: 2000,
  61. className: 'custom-toast',
  62. callback: function () { console.log('close') }
  63. });
  64. return
  65. }
  66. //保存新附加词
  67. _addkws = keyWord;
  68. saveSession("",_addindex);
  69. var html = `<li>
  70. <div class="one">
  71. <div>
  72. <span>
  73. <p class="key">${ keyWord }</p>
  74. </span>
  75. </div>
  76. <button class="editKeyWord" dataindex="`+_addindex+`"><i class="iconfont icon-xiugai"></i> 修改</button>
  77. </div>
  78. <div class="modify">
  79. <textarea name="" rows="1" placeholder="" maxlength="20">${ keyWord}</textarea>
  80. <button class="deleteKey">删除</button>
  81. <button class="ascertainKey">确定</button>
  82. </div>
  83. </li>`
  84. $('.showKeyWord > ul').prepend(html)
  85. // 隐藏
  86. $(".addkeyWord").hide();
  87. $('.showKeyWord').show();
  88. $('.addKeyWord').show();
  89. $('.enter.addkeyWord > input').val('')
  90. var buttonDOM = $('.enter.addkeyWord .btn button')[1]
  91. buttonDOM.style.opacity = .5
  92. buttonDOM.setAttribute("disabled", true)
  93. })
  94. // 编辑
  95. $(".showKeyWord").on('click', '.editKeyWord',function(e){
  96. _addindex = Number($(this).attr("dataindex"));
  97. $('.enter.addkeyWord').hide()
  98. $('.addKeyWord').hide()
  99. let oSpan = $(this).parent().siblings().children('textarea');
  100. let val = $(oSpan).val()
  101. $(this).parent().siblings().show().parents('li').siblings().children('.modify').hide().siblings('.one').show()
  102. $(oSpan).val('').focus().val(val)
  103. $(this).parent().hide()
  104. $(this).parent().siblings().css('display','block')
  105. })
  106. // 编辑 删除
  107. $('.showKeyWord').on('click', '.deleteKey', function(e) {
  108. var jQueryDOM = $(this).parents('li');
  109. _addkws = $(this).siblings('textarea').val();
  110. var _index = $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
  111. weui.confirm('确定要删除附加词?', {
  112. buttons: [{
  113. label: '取消',
  114. type: 'default',
  115. onClick: function () { console.log('不删了') }
  116. }, {
  117. label: '确定',
  118. type: 'primary',
  119. onClick: function () {
  120. jQueryDOM.remove();
  121. hasWords();
  122. saveSession("D",_addindex,_index);
  123. }
  124. }]
  125. });
  126. })
  127. // 编辑 确定
  128. $('.showKeyWord').on('click', '.ascertainKey', function(e) {
  129. var keyWord = $(this).siblings('textarea').val();
  130. var _index = $('.showKeyWord li').length - $(this).parent().parent("li").index() -1;
  131. if(keyWord.length > 20){
  132. weui.toast('每组附加词不能超过20字', {
  133. duration: 2000,
  134. className: 'custom-toast',
  135. callback: function () { console.log('close') }
  136. });
  137. }else{
  138. if(addkws_arr[keyWord]!=undefined&&addkws_arr[keyWord]!=_addindex){
  139. weui.toast('您设置的附加词已存在,请调整后再添加。', {
  140. duration: 2000,
  141. className: 'custom-toast',
  142. callback: function () { console.log('close') }
  143. });
  144. return
  145. }
  146. $('.addKeyWord').show()
  147. _addkws = keyWord;
  148. saveSession("",_addindex,_index);
  149. $(this).parent().siblings().find('.key').text(keyWord)
  150. $(this).parent().hide().siblings().show()
  151. }
  152. })
  153. //防止键盘把当前输入框给挡住
  154. var u = navigator.userAgent;
  155. var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
  156. var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
  157. if(isAndroid){
  158. //防止键盘把当前输入框给挡住
  159. window.addEventListener('resize', function () {
  160.    if (document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA') {
  161.    window.setTimeout(function () {
  162.           document.activeElement.scrollIntoViewIfNeeded();
  163. }, 0);
  164. }
  165. })
  166. }
  167. (/iphone|ipod|ipad/i.test(navigator.appVersion)) && document.addEventListener('blur', (e) => {
  168. // 这里加了个类型判断,因为a等元素也会触发blur事件
  169. ['input', 'textarea'].includes(e.target.localName) && document.body.scrollIntoView(false)
  170. }, true)
  171. })