Question

我在jQuery代码中的问题。我有这段代码jsFiddle。

$(document).ready(function(){
  $("#clickinput1").click(function (evt) {
     $(this).hide().prev("input[disabled]").prop("disabled", false).focus();
  });
});

在点击按钮之前，输入被禁用并且背景较暗。我需要，当点击按钮输入启用（此工作）和背景更改为白色或无。我做不到这个。请帮忙）

Answer 1

只需使用.css("background-color","white")就可以完成：

$(this).hide().prev("input[disabled]").prop("disabled", false).css("background-color","white").focus();

希望这有帮助。

$(document).ready(function() {
  $("#clickinput1").click(function(evt) {
    $(this).hide().prev("input[disabled]").prop("disabled", false).css("background-color", "white").focus();
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="text" name="customername" class="input" value="" disabled />

<div style="float:right;cursor:pointer;margin:2px 0 0 0px;" id="clickinput1">
  <img src="https://cdn4.iconfinder.com/data/icons/simplicio/128x128/document_edit.png" />button
</div>

Answer 2

$(document).ready(function(){
    $("#clickinput1").click(function (evt) {
        $(this).hide().prev("input[disabled]").prop("disabled", false).focus();
        $(".input").css("background-color", "white");
    });
});

Answer 3

您将css作为$("#white").css("background-color:#fff");。这不是在jquery中消除css的正确方法。它应该是$("#white").css("background-color","#fff");。另一件事是你没有将white的id赋予任何元素。更改所有这些将解决您的问题。

＆＃13;

$(document).ready(function() {
  $("#clickinput1").click(function(evt) {
    $(this).hide().prev("input[disabled]").prop("disabled", false).focus();
    $("#white").css("background-color", "#fff");
  });
});

＆＃13;

.input {
  border: 0px;
  outline: none;
  background: #ccc;
  height: 20px;
  width: 250px;
  font: 18px Calibri;
  margin-top: 1px;
}

body {
  background-color: #006699;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="customername" class="input" value="" id="white" disabled />
<div style="float:right;cursor:pointer;margin:2px 0 0 0px;" id="clickinput1"><img src="img/edit.png" />button</div>

＆＃13;

即使我们不需要定义任何ID。这可以简单地像这样完成

＆＃13;

$(document).ready(function() {
  $("#clickinput1").click(function(evt) {
    $(this).hide().prev("input[disabled]").prop("disabled", false).focus().css("background-color", "#fff");
   
  });
});

＆＃13;

.input {
  border: 0px;
  outline: none;
  background: #ccc;
  height: 20px;
  width: 250px;
  font: 18px Calibri;
  margin-top: 1px;
}

body {
  background-color: #006699;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="customername" class="input" value="" id="white" disabled />
<div style="float:right;cursor:pointer;margin:2px 0 0 0px;" id="clickinput1"><img src="img/edit.png" />button</div>

＆＃13;

jQuery prev next元素

3 个答案: