如何在此代碼中顯示輸入標籤？

$(function() { 
$("input").hide(); 
$("li").on("click",function(){ 
    $(this).hide(500); 
    var inp = $(this).find("input"); 
    $(inp).show(500) 
    }) 
});

我想讓它顯示在span標籤如何在此代碼中顯示輸入標籤？

<!DOCTYPE html> 
<html> 
<head> 
    <title>Bookmarks</title> 
    <script src="https://code.jquery.com/jquery-3.1.1.js"></script> 
</head> 
<body> 
    <h1>Bookmarks</h1> 
    <h2>click on the items below to edit</h2> 
    <ul id="list"> 
    <li> <span>apple</span> <input value="apple"> </li> 
    <li> <span>banana</span> <input value="banana"> 
</li> 
    <li> <span>orange</span> <input value="orange"> </li> 
    </ul> 
</body> 
</html>

只有輸入字段，而不是文字這是我在這個網站第一後對任何錯誤讓我非常抱歉。 Iam試圖製作書籤系統

來源

2017-06-13 The Tech Weaver

請同時提供html部分 –

現在正在發生什麼？你是否嘗試在發佈之前調試它？ – guradio

this在點擊柄指<li>節點，所以當你調用它.hide()所有子節點也隱藏。您應該將span元素定位在li之內。

$(function() { 
 
    $("input").hide(); 
 
    $("li").on("click", function() { 
 
    $('span', this).hide(500); 
 
    $('input', this).show(500); 
 
    }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<h1>Bookmarks</h1> 
 
<h2>click on the items below to edit</h2> 
 
<ul id="list"> 
 
    <li> <span>apple</span> 
 
    <input value="apple"> </li> 
 
    <li> <span>banana</span> 
 
    <input value="banana"> 
 
    </li> 
 
    <li> <span>orange</span> 
 
    <input value="orange"> </li> 
 
</ul>

來源

2017-06-13 09:28:04 nizzik

非常感謝你解決我的問題：D –

結束了這個https://jsfiddle.net/ej200xxp/ –

@TheTechWeaver如果答案已解決您的問題，請接受它。此外，我更新了一小段代碼片段：https：//jsfiddle.net/ej200xxp/2/ – nizzik

你想要這個嗎？ See this fiddle

$("input").hide(); 
$("li").on("click",function(){ 
    $(this).find('span').hide(500); 
    var inp = $(this).find("input"); 
    $(inp).show(500); 
});

來源

2017-06-13 09:26:50

是的，我想改變跨文本的價值，我輸入裏面的輸入也謝謝你：D –

如果你只能一個文本字段，以顯示試試這個代碼

<input type="text" name="" value="hello"> 
<ul> 
<li>test</li> 
</ul>

您的.js文件擴展這裏

<script type="text/javascript" src="../library/jquery-3.2.1.min.js"></script> 
<script type="text/javascript"> 
$(function() { 
$("input").hide(); 
$("li").on("click",function(){ 
    $(this).hide(500); 
    $('input').show(500) 
    }) 
}); 
</script>

，如果你可以點擊李麗將被隱藏並使用input關鍵字文字d將會顯示

來源

2017-06-13 09:45:22

如何在此代碼中顯示輸入標籤？

回答

相關問題