原生Ajax手动提交form表,将input标签的name:value值转换为字符串
背景
我在使用form进行传递数据的时候,发现不知道如何调用回调函数,
这个时候使用了原生的Ajax,但是使用xhr.open进行get请求的时候,需要带上form标签中input的数据.这里需要将input中的name:value转换为字符串的形式进行显式提交
代码
function collectionsInputArg(formNode) {// 将INPUT内容转换为对象 let saveNameAndValue = {}; // 返回的对象 let notSaveNodes = []; // 主要用于调试所用 : 没有保存进对象的节点列表,函数结束自动销毁此变量. for (let item of formNode.elements) { if (!(item.name in saveNameAndValue) && item.nodeName === ‘INPUT‘) { // 判断唯一性 && 节点标签 if (item.value == ‘‘) { // 如果值为空决定如何操作 item.value = ‘ ‘; // 这里设置了一个空格 } saveNameAndValue[item.name] = item.value; } else { notSaveNodes.push(item); // 调试信息 console.log(notSaveNodes); } } return saveNameAndValue; } function objTransformStrFn(transObject) { // 将对象转换为字符串 let returnStr = ‘‘; let objKeys = Object.keys(transObject); for (let item of objKeys) { if (transObject[item]) { returnStr += item + ‘=‘ + transObject[item] + ‘&‘; } } return returnStr.slice(0, -1); }
/* // 在AJAX中调用? 示例 : const form1 = document.getElementById(‘form1‘);//获取表单 let saveObjTransformStr = objTransformStrFn(collectionsInputArg(form1));// 在请求事件中中调用此函数. 结果 : URL : http://127.0.0.1:3000/?user_name= &sex=男&hobby=吃饭睡觉打豆豆 转换为字符串 : user_name= &sex=男&hobby=吃饭睡觉打豆豆 */
相关推荐
wcqwcq 2020-07-04
kentrl 2020-11-10
结束数据方法的参数,该如何定义?-- 集合为自定义实体类中的结合属性,有几个实体类,改变下标就行了。<input id="add" type="button" value="新增visitor&quo
ajaxyan 2020-11-09
zndy0 2020-11-03
学留痕 2020-09-20
Richardxx 2020-11-09
learningever 2020-09-19
chongxiaocheng 2020-08-16
ajaxhe 2020-08-16
lyqdanang 2020-08-16
curiousL 2020-08-03
TONIYH 2020-07-22
时光如瑾雨微凉 2020-07-19
83510998 2020-07-18
坚持着执着 2020-07-16
jiaguoquan00 2020-07-07
李永毅 2020-07-05