用js写一个如果没有输入内容就弹出提示框

Posted 2023-05-17

用户名：<input id="username" />
密码：<input id="userpwd" />

怎么判定没有输入内容是，弹出提示框？
$(function()
if(this.value=="")
$("#username").mouseout(function()
var a="请输入用户名！";
alert(a);
);

);

错在哪里请纠正！

参考技术A 思路：
如果要输入多个信息，那么原生的提示框肯定不符合要求，需要自己定义。
一般都是使用div层模拟提示框，这样就可以随便布局了。
代码示例：

1、定义CSS
<style type="text/css">
body
height: 100%;
overflow: auto;
margin: 0;

#test_Div
position: fixed;
_position: absolute;
top: 50%;
left: 50%;
border: 2px solid #C0C0C0;/*弹出框边框样式*/
background-color: #FFFFFF;/*弹出框背景色*/
display:none;

* html
overflow: hidden;
position: absolute;

</style>2、简单点，引入JQuery
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery_ui/js/jquery-ui-1.9.2.custom.min.js"></script>3、弹出层

function show_Win(div_Win, tr_Title, event)
var s_Width = document.documentElement.scrollWidth; //滚动 宽度
var s_Height = document.documentElement.scrollHeight; //滚动 高度
var js_Title = $(document.getElementById(tr_Title)); //标题
js_Title.css("cursor", "move");
//创建遮罩层
$("<div id=\"div_Bg\"></div>").css( "position": "absolute", "left": "0px", "right": "0px", "width": s_Width + "px", "height": s_Height + "px", "background-color": "#ffffff", "opacity": "0.6" ).prependTo("body");
//获取弹出层
var msgObj = $("#" + div_Win);
msgObj.css('display', 'block'); //必须先弹出此行，否则msgObj[0].offsetHeight为0，因为"display":"none"时，offsetHeight无法取到数据；如果弹出框为table，则为'',如果为div，则为block，否则textbox长度无法充满td
//y轴位置
var js_Top = -parseInt(msgObj.height()) / 2 + "px";
//x轴位置
var js_Left = -parseInt(msgObj.width()) / 2 + "px";
msgObj.css( "margin-left": js_Left, "margin-top": js_Top );
//使弹出层可移动
msgObj.draggable( handle: js_Title, scroll: false );
4、调用
<input type="button" value="测试弹出框" onclick="show_Win('div_Test', 'title', event)" />
<div id="div_Test">
<div id="title" style="border: 1px solid red;">标题</div>
内容
</div>本回答被提问者采纳

有关js弹出提示框几种方法

 

1直接提示只有确定功能的提示框 只显示提示信息 alert(“提示信息”);
alert ();的参数只有一个就是提示信息，无返回值

2 弹出输入框让你输入内容 prompt() ;

有两个参数：第一个显示提示信息，第二个显示输入框的默认值

3有确定和取消功能的函数 comfirm(“提示信息”);
就一个参数即提示信息 有返回值 true或false
用法为如下
在js中：
function IsSure(){
var mes=confirm("您确定要**吗？");
if(mes==true){ do sth; }
else{ do otherthings; }

}

<input id="shanchu"type="button" value="删 除" onclick="IsSure();"/>

4 弹出新的提示页面的函数 window.open("page.aspx");
参数如下：
可以通过设置参数来设置此页面的大小
window.open 弹出新窗口的命令； 
‘page.aspxs弹出窗口的文件名； 
‘newwindow‘ 弹出窗口的名字（不是文件名），非必须，可用空‘‘代替； 
height=100 窗口高度； 
width=400 窗口宽度； 
top=0 窗口距离屏幕上方的象素值； 
left=0 窗口距离屏幕左侧的象素值； 
toolbar=no 是否显示工具栏，yes为显示； 
menubar，scrollbars 表示菜单栏和滚动栏。 
resizable=no 是否允许改变窗口大小，yes为允许； 
location=no 是否显示地址栏，yes为允许； 
status=no 是否显示状态栏内的信息（通常是文件已经打开），yes为允许；
例如：window.open ("page.aspx", "newwindow", "height=100, width=400, toolbar =no, menubar=no, 
scrollbars=no, resizable=no, location=no, status=no");