如何为Prompt添加校验？空Prompt校验提示失效问题求助

嘿，我看了你的代码，问题主要出在几个小细节上，咱们一步步来修正：

原代码的核心问题 #

• 错误使用了$("pr").val()：pr是你存储prompt返回值的变量，不是DOM元素，根本不能用jQuery选择器去取它的value，直接判断变量本身即可。
• 逻辑顺序颠倒：你先把prompt的结果设置成了href，再去校验是否为空，这时候就算输入为空，也已经把href设成空值了，校验提示自然没在正确时机触发。
• 没处理用户点击取消的场景：prompt点击取消会返回null，原代码没做这个判断，容易出现异常。

修正后的完整代码 #

先放HTML部分（假设你的页面结构是这样的）：

<button id="b1">修改链接地址</button>
<a href="http://example.com" target="_blank">原链接</a>

然后是优化后的jQuery代码：

$("#b1").click(function() {
  let inputVal;
  // 循环直到用户输入有效内容或取消操作
  do {
    inputVal = prompt("enter new link address");
    // 处理用户点击取消的情况，直接退出函数
    if (inputVal === null) {
      return;
    }
    // 校验是否为空（包括只输入空格的情况）
    if (inputVal.trim() === '') {
      confirm('Input can not be left blank');
    }
  } while (inputVal.trim() === '');
  
  // 只有输入有效时，才更新链接地址
  $("a").attr("href", inputVal);
});

代码说明 #

• 用do-while循环实现重复校验：只要用户输入为空，就一直弹出提示，直到输入有效内容或者点击取消。
• 增加inputVal === null判断：处理用户点击取消的场景，避免后续代码执行异常。
• 用trim()判断空值：连用户只输入空格的情况也能覆盖，校验更严谨。
• 调整逻辑顺序：先完成校验，确认输入有效后再更新href，避免无效值覆盖原有链接。

这样修改后，当用户留空点击继续时，错误提示就能正常触发啦。

内容的提问来源于stack exchange，提问作者Osama Ijaz