單擊表單字段時顯示圖像HTML/JQuery

使用HTML/jQuery或JavaScript在表單域中單擊時是否可以使圖像可見？單擊表單字段時顯示圖像HTML/JQuery

這是我的表單字段（Laravel）：

<div class="form-group"> 

    {!! Form::label('twitter', 'Twitter:') !!} 
    {!! Form::text('twitter', null, ['class'=>'form-control']) !!} 

</div>

HTML部分：

<a href="http://ss"> 
    <img width="16" 
    src="https://s3.amazonaws.com/htmlsig-assets/round/twitter.png" alt="Twitter"> 
</a>

來源

2015-12-31 Lucky Luke

給的鏈接的ID，使用CSS

#linkId { display:none }

隱藏它，做

$(function() { 
$(".form-control").on("click",function() { 
    $("#linkId").show(); 
}); 
});

要刪除，如果空：

$(function() { 
$(".form-control").on("focus, keyup",function() { 
    $("#linkId").toggle(this.value!=""); 
}); 
});

來源

2015-12-31 07:16:52 mplungjan

這清楚地回答。如果我想在表單中的所有字符都被刪除的情況下解散圖像，該怎麼做？非常感謝你。 –

查看更新..... – mplungjan

非常感謝。：3 –

最初保持隱藏類在你的形象，如果你使用的引導，當你點擊任何表單字段從img標籤中移除隱藏的類。

如果你不使用bootstrap，那麼可以使用CSS來實現。

假設您的錨標記隱藏了類。

$("input").on("focus", function() { 
    $(a).removeClass("hidden"); 
}

來源

2015-12-31 07:09:09

單擊表單字段時顯示圖像HTML/JQuery

回答

相關問題