HTML implementiert ein einfaches Eingabeaufforderungsfeld

In diesem Artikel stellen wir Ihnen ein einfaches Eingabeaufforderungsfeld vor, das in HTML implementiert ist. Da das Projekt ein einfaches Eingabeaufforderungsfeld erfordert, müssen Sie nur mit der Maus darauf klicken, um relevante Informationen abzufragen Drittanbieter, daher ist es hier gekapselt Eine sehr einfache HTML-Methode.

<script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script> 
function show(obj,id) { 
var objp = $("#"+id+""); 

/**
   这里我们可以使用ajax从数据库获取数据动态改变提示框里的内容
   $.post('./test.php',{act:"ajax_get_ifo", goods_id:goods_id}, function (res){
                objp.html("<br>"+res.data+"<br>");
            }, 'json');
**/
$(objp).css("display","block"); 
$(objp).css("left", event.clientX + 30); 
$(objp).css("top", event.clientY - 45); 
} 
function hide(obj,id) { 
var objp = $("#"+id+""); 
$(objp).css("display", "none"); 
} 
</script> 


<p id="myp1" style="position:absolute;display:none;border:1px solid silver;background:gray;filter:alpha(Opacity=80);-moz-opacity:0.5;opacity: 0.7;"> 
提示1效果 
</p> 
<p id="myp2" style="position:absolute;display:none;border:1px solid silver;background:silver;filter:alpha(Opacity=80);-moz-opacity:0.5;opacity: 1.0;"> 
不知道你们在干嘛呢，<br/>哈哈哈哈
</p> 

<a id="t1" onMouseOver="javascript:show(this,&#39;myp1&#39;);" onMouseOut="hide(this,&#39;myp1&#39;)">鼠标放上去1</a> 
<br><br><br><br><br> 
<a id="t2" onMouseOver="javascript:show(this,&#39;myp2&#39;);" onMouseOut="hide(this,&#39;myp2&#39;)">鼠标放上去2</a>

Verwandte Empfehlungen:

Wie wäre es CSS Detaillierte Erläuterung von Beispielen für die Implementierung von Eingabeaufforderungsfeldern

Verwendung von CSS zur Implementierung vollständig kompatibler Tooltip-Eingabeaufforderungsfelder

Vier Arten von Eingabeaufforderungsfeldern codes_PHP-Tutorial

Das obige ist der detaillierte Inhalt vonHTML implementiert ein einfaches Eingabeaufforderungsfeld. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!