jquery - 如何在文本域中添加图像

标签 jquery css

我正在制作一个网站,当用户在文本框中添加答案并单击提交按钮时,如果答案正确,它将显示为绿色,否则显示为红色,有效和无效的图像将分别显示在文本框上。 .. 请帮助我 .. 我有以下几行代码 ..

HLML代码:

<body>
    <div id="content">babababababababababa.
        <input type="text" id="ans1" />y
        <input type="text" id="ans2" />asasasasasa
        <br />
        <br />
        <input type="text" id="ans3" />rtrtrtr
        <input type="text" id="ans4" />sddddddd
        <input type="text" id="ans5" />iuyerr
        <input type="text" id="ans6" />a la
        <br />
        <br />situación actual y
        <input type="text" id="ans7" />cccccc
        <input type="text" id="ans8" />skdodksodsdkss
        <br />
        <br />
        <br />
        <div align="center">
            <input type="submit" onClick="check()" />
        </div>
    </div>
</body>

CSS 代码:

     #ans1 ,#ans6 {
      background:#FFFFFF url(xx.png) 4px 4px ;
      background-position: right top;
      background-repeat: no-repeat;
      padding:4px 4px 4px 22px;
      height:22px;
      } 
     input[type="text"],input[type="submit"]
                {
      border:none;
      border:1px solid black;
      border-radius:5px;
      width:143px;
      height:23px;
      background:red;
      background:#EEEEEE;
      font-weight:bold;
      }
        body
                  {
      background:#BBBBBB;
      margin:auto;
      padding:100px;
      }
     #content
      {
       border:2px solid #AAAAAA;
       border-radius:15px 15px;
       padding:20px;
       }

Javascript 代码:

   function check() {
        var ans1 = document.getElementById("ans1").value;
        var a1ns1 = document.getElementById("ans1");
        if (ans1 == "Crear") {
            a1ns1.style.color = "green";
        } else {
            a1ns1.style.color = "red";

        }
    }

最佳答案

如果你想用 jQuery 改变文本框的图像,你可以这样做:

$('#ans1').css('background-image', 'url("url-to-your-image")');

关于jquery - 如何在文本域中添加图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23444628/

相关文章:

javascript - 如何在文本区域中的当前插入符位置插入文本

jquery - 如何使用 Jquery 和 Hype 为 HTML5 视频创建音量 slider

asp.net-mvc - 了解 VS 如何解析 .ascx 文档中的 CSS

jquery - 如何在 CoffeeScript 中创建 jQuery 插件?

javascript - WordPress 小部件中的动态输入字段

javascript - ("change"上的 Select2 事件返回空数据参数

css - 列表中图像的垂直对齐

javascript - 溢出隐藏元素

html - 文本消失在容器后面

css - ng-动画中的 ng-repeat 不起作用