如何用jQuery实现点击跳转至带参数ASP页面的正确语法

原代码核心问题点 #

• 引号嵌套冲突：HTML字符串外层用单引号包裹时，内部的属性、JS代码若重复使用单引号会直接截断字符串，导致语法完全失效
• 参数拼接逻辑错误：将$.param方法直接写在单引号包裹的字符串内，方法不会被执行，只会被当成普通文本
• 作用域隔离问题：ajax success回调内的局部变量studentid，无法被行内onclick事件直接读取，会报变量未定义
• $.param使用错误：该方法需要接收键值对对象生成查询串，直接传入studentid原始值会生成不符合要求的参数格式

推荐实现写法（无行内事件绑定，稳定性最高） #

在ajax success回调中、获取到studentid值的位置，通过jQuery动态创建带正确跳转参数的链接，无嵌套引号问题、无作用域读取问题：

// 接在现有代码 var studentid = r[0]; 之后
jQuery("#status_text").empty().append('User reactivated. ');
// 动态创建Deactivate跳转链接
jQuery('<a>', {
    text: 'Deactivate',
    // 正确拼接目标地址与查询参数
    href: 'deactivationreason.aspx?' + $.param({ studentid: studentid })
}).appendTo('#status_text');

这种写法点击链接时会直接携带正确的studentid参数跳转到deactivationreason.aspx页面，不需要额外写onclick逻辑。

兼容原有结构的修正写法 #

如果需要保留原有HTML字符串拼接的形式，需提前拼接好完整跳转地址，替换掉原来的错误onclick逻辑：

// 接在现有代码 var studentid = r[0]; 之后
const deactivateTarget = 'deactivationreason.aspx?' + $.param({ studentid: studentid });
jQuery("#status_text").html(`User reactivated.<a href="${deactivateTarget}">Deactivate</a>`);

注意：不要在a标签上保留href="#"加行内onclick的写法，既会出现无意义的页面顶部跳转闪屏，也容易出现引号截断、变量读取失败的语法问题。

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