首页 前端知识 vue拼接html中a标签 onclick触发方式,并且使用post请求跳转

vue拼接html中a标签 onclick触发方式,并且使用post请求跳转

2024-02-26 20:02:47 前端知识 前端哥 611 620 我要收藏

vue拼接html中a标签onclick

<a onclick="js_method(\''+item.cutovercucCaseNoRoam+'\')" >点击</a>
mounted(){
 window.js_method=(val)=>{
      this.js_method(val)
    } 
},

post跳转,不受get长度限制

<iframe src="about:blank" id="leftFrame" name="leftFrame" frameborder="0"></iframe>
js_method(val) {
      if(val) {
        let url = val;
        // 获取参数部分
        let params = url.split('?')[1];
        // 将参数部分转换为对象
        let paramsObj = {};
        if (params) {
          let paramsArr = params.split('&');
          for (let i = 0; i < paramsArr.length; i++) {
            let param = paramsArr[i].split('=');
            paramsObj[param[0]] = param[1];
          }
        }
        let encryptdata = paramsObj['encryptdata'];
        var urls = url.split('?')[0]; //定义iframe页面的form表单的action

        //定义form表单
        var html1 = '<form id="queryForm" name="queryForm" method="post" target="_blank" action="' + urls + '">' +
          '<input type="hidden" id="encryptdata" name="encryptdata" value="' + encryptdata + '"/>' +      //encryptdata是一个长度超过3000字符的值
          '</form>';
          console.log(html1);
        document.getElementById('leftFrame').contentWindow.document.write(html1);  //将表单写入iframe中
        document.getElementById('leftFrame').contentWindow.document.getElementById('queryForm').submit();
                document.getElementById('leftFrame').contentWindow.location.reload(); // 防止页面链接重复


      }
    },
转载请注明出处或者链接地址:https://www.qianduange.cn//article/2737.html
标签
评论
会员中心 联系我 留言建议 回顶部
复制成功!