jQuery UI高亮效果可以应用于表单文本输入吗?

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了jQuery UI高亮效果可以应用于表单文本输入吗?相关的知识,希望对你有一定的参考价值。

想知道jQuery UI的'突出'效果是否可用于表单文本输入。我想为背景颜色设置动画以指示字段已成功更新(单个字段,由Ajax成功事件触发的动画)。

答案

您可以使用Jquery动画功能。首先使用动画绿色更改文本框的背景颜色以通知用户已成功保存的内容然后您可以再次将其简化为原始颜色。您可以在ajax成功函数中编写此代码。

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>highlight demo</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
  <style>
  #toggle {
    background: #fff;
  }
  </style>
  <script src="//code.jquery.com/jquery-1.12.4.js"></script>
  <script src="//code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<body>
 
<p>Click anywhere to toggle the box.</p>
<input id="input-animate">
 
<script>
$( document ).click(function() {
  $( "#input-animate" ).animate({
          backgroundColor: "#009900",
          easing: "easein"
        }, 1500 , function(){
          $( "#input-animate" ).animate({
          backgroundColor: "#fff",
        }, 500)
        })
});
</script>
 
</body>
</html>

以上是关于jQuery UI高亮效果可以应用于表单文本输入吗?的主要内容,如果未能解决你的问题,请参考以下文章

jQuery几个经典表单应用整理回想

jQuery整理笔记七----几个经典表单应用

文本框中的特定文本可以触发 jQuery 事件吗?

JS高亮文本字符串

深入浅出Flask(15): H-ui前端框架的表单

如何使用 jQuery 在页面加载时关注表单输入文本字段?