使用jquery在DropDownList中编辑或删除项目

我需要使用jquery对下拉列表中的项目执行编辑和删除操作。对于编辑来说，我用下面的值编码使用jquery在DropDownList中编辑或删除项目

$(".imgE").click(function() 
      { 
       var value = $(this).siblings(".ename").text() 
       $(this).siblings(".ename").hide(); 
       $(this).siblings(".edit").show().val(value).focus(); 
      } 
$(".edit").focusout(function() 
        { 
         $(this).hide().siblings(".ename").show().text($(this).val()); 
        });

和删除我用下面的值编码

$(".imgD").click(function() 
     { 
      $(this).parent().parent().remove(); 

     });

我能不能够修改的项目

来源

2015-09-25 Kalai

-1

<!DOCTYPE HTML> 
 
<html> 
 

 
<head> 
 
    <script src="jquery.js"></script> 
 

 
    <script> 
 
    $(document).ready(function() { 
 
     $(".imgE").click(function() { 
 
     var value = $(this).siblings(".ename").text() 
 
     $(this).siblings(".ename").hide(); 
 
     $(this).siblings(".edit").show().val(value).focus(); 
 
     }); 
 
     $(".edit").focusout(function() { 
 
     $(this).hide().siblings(".ename").show().text($(this).val()); 
 
     }); 
 
     $(".imgD").click(function() { 
 
     $(this).parent().remove(); 
 
     }); 
 
    }); 
 
    </script> 
 
    <style type="text/css"> 
 
    .imgE, 
 
    .imgD { 
 
     height: 20px; 
 
     width: 20px; 
 
     padding: 1px; 
 
    } 
 
    li { 
 
     width: 100%; 
 
    } 
 
    .ename, 
 
    .edit { 
 
     display: inline-block; 
 
     width: 70%; 
 
    } 
 
    .edit { 
 
     display: none; 
 
    } 
 
    </style> 
 

 
</head> 
 

 
<body> 
 
    <ul> 
 
    <li><span class="ename">ITEM1</span> 
 
     <input class="edit" value="ITEM1" /> 
 
     <img src="edit.png" class="imgE" /> 
 
     <img src="delete.png" class="imgD"> 
 
    </li> 
 
    <li><span class="ename">ITEM1 </span> 
 
     <input class="edit" value="ITEM1" /> 
 
     <img src="edit.png" class="imgE" /> 
 
     <img src="delete.png" class="imgD"> 
 
    </li> 
 
    <li><span class="ename">ITEM1</span> 
 
     <input class="edit" value="ITEM1" /> 
 
     <img src="edit.png" class="imgE" /> 
 
     <img src="delete.png" class="imgD"> 
 
    </li> 
 
    <li><span class="ename">ITEM1 </span> 
 
     <input class="edit" value="ITEM1" /> 
 
     <img src="edit.png" class="imgE" /> 
 
     <img src="delete.png" class="imgD"> 
 
    </li> 
 
    </ul> 
 
    </div> 
 
</body> 
 

 
</html>

<!DOCTYPE HTML> 
 
<html> 
 

 
<head> 
 
    <script src="jquery.js"></script> 
 
    <script src="https://google-codeettify.googlecode.com/svn/loader/run_prettify.js"></script> 
 
    <script> 
 
    $(document).ready(function() { 
 
     $(".imgE").click(function() { 
 
     var value = $(this).siblings(".ename").text() 
 
     $(this).siblings(".ename").hide(); 
 
     $(this).siblings(".edit").show().val(value).focus(); 
 
     }); 
 
     $(".edit").focusout(function() { 
 
     $(this).hide().siblings(".ename").show().text($(this).val()); 
 
     }); 
 
     $(".imgD").click(function() { 
 
     $(this).parent().remove(); 
 
     }); 
 
    }); 
 
    </script> 
 
    <style type="text/css"> 
 
    .imgE, 
 
    .imgD { 
 
     height: 20px; 
 
     width: 20px; 
 
     padding: 1px; 
 
    } 
 
    li { 
 
     width: 100%; 
 
    } 
 
    .ename, 
 
    .edit { 
 
     display: inline-block; 
 
     width: 70%; 
 
    } 
 
    .edit { 
 
     display: none; 
 
    } 
 
    </style> 
 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" /> 
 
</head> 
 

 
<body> 
 
    <ul> 
 
    <li><span class="ename">ITEM1</span> 
 
     <input class="edit" value="ITEM1" /> 
 
     <img src="edit.png" class="imgE" /> 
 
     <img src="delete.png" class="imgD"> 
 
    </li> 
 
    <li><span class="ename">ITEM1 </span> 
 
     <input class="edit" value="ITEM1" /> 
 
     <img src="edit.png" class="imgE" /> 
 
     <img src="delete.png" class="imgD"> 
 
    </li> 
 
    <li><span class="ename">ITEM1</span> 
 
     <input class="edit" value="ITEM1" /> 
 
     <img src="edit.png" class="imgE" /> 
 
     <img src="delete.png" class="imgD"> 
 
    </li> 
 
    <li><span class="ename">ITEM1 </span> 
 
     <input class="edit" value="ITEM1" /> 
 
     <img src="edit.png" class="imgE" /> 
 
     <img src="delete.png" class="imgD"> 
 
    </li> 
 
    </ul> 
 
    </div> 
 
</body> 
 

 
</html>

来源

2015-09-25 12:07:01

我编程，这样和我的工作。 –

也许一些解释你为什么这样做会很好。 – GHajba

使用jquery在DropDownList中编辑或删除项目

回答

相关问题