search
HomeComputer TutorialsComputer KnowledgeUsing JavaScript how to extract textbox content through loop and convert it to JSON format to display in new window

Using JavaScript how to extract textbox content through loop and convert it to JSON format to display in new window

How to extract the text box content in a loop in javascript and make it into json format and send it to a new window for display

Your ids are not consecutive, this id attribute is useless

I think of two methods

1,

You can take out all the text boxes on the page and traverse the dom or use jquery $("texterea") or querySelectorAll("textarea")

var data={},nodes=querySelectorAll("textarea");//All text boxes may be useful

for(var i=0,l=nodes.length;i

data[nodes[i].id]=nodes[i].value; //If there are text boxes that do not meet the conditions, you can also filter them out

};

var json=JSON.stringify(data);//Json comes out and is sent to a new page? I don’t know what you want 2.

When your program outputs the page, it should also output json. The prerequisite is that the page is written by you

How to get data from json

Expand All

According to the returned string, it can be seen that it is in the form of a js array spliced ​​into multiple jsons.

If only a string is returned, the string must be converted into a js object.

Use Jquery's $.each() method to loop through the js array to retrieve the data of each json object.

str = '[{"key":"value","keys":[{"key1":"value1","key2":"value2"},{"key1":"value3","key2 ":"value4"}],"obj":{"id":1,"msg":"success"}}]';

str_json = eval("(" str ")"); //Convert string into js object

$.each(str_json,fucntion(a,b){

alert(a); //Pop up the key of the array

alert(b.id);//Pop up the data to be taken out

});

How does JS javascript convert an ordinary array into a JSON array

First of all, there is a syntax error in your array~

In JS, json is a string representation. Your B is obviously an object and has nothing to do with json~

So it is converting between js objects (arrays) and json strings~

Then your A (the example in js uses Camel rules, so it should be written as a lowercase a) should be written as:

var a = {

name: "XXXX", //Attributes are also Camel rules

year: 1990,

old: 21

};

Then there is the conversion problem, using the JSON class:

var b = JSON.stringify(a); //Note that b is a json string

If the JSON object cannot be found, your browser version is too old

You need to manually reference the json class library

Please download and quote "json2.js" by yourself

Hope it helps you~

By Billskate

How does JS write json format data into an array

json array zhidao is also an array

//1,

var jsonstr="[{'name':'a','value':1},{'name':'b','value':2}]";

var jsonarray = eval('(' jsonstr ')');

var arr =

{

"name" : $('#names').val(),

"value" : $('#values').val()

}

jsonarray.push(arr);

//2,

var json={};//Define a json object

json.array1=["2","4"];//Add a new attribute, this attribute is an array

json.array1[json.array1.length]='6'; //Append an element to the array

alert(json.array1)

The above is the detailed content of Using JavaScript how to extract textbox content through loop and convert it to JSON format to display in new window. For more information, please follow other related articles on the PHP Chinese website!

Statement
This article is reproduced at:Excel办公网. If there is any infringement, please contact admin@php.cn delete
Linux vs Mac: How to Install Linux on Mac - MiniToolLinux vs Mac: How to Install Linux on Mac - MiniToolMay 14, 2025 am 01:21 AM

What’s the difference between Linux and Mac? Do you want to install Linux on Mac? This post from php.cn will show you all. You can refer to this guide to dual boot Linux and macOS.

What Is MHTML & What Are the Differences Between It and HTML - MiniToolWhat Is MHTML & What Are the Differences Between It and HTML - MiniToolMay 14, 2025 am 01:20 AM

What is MHTML? How to open or view it? What are the differences between it and HTML? How to convert MHTML to HTML? If you are looking for the answers to the above questions, you can refer to this post from php.cn.

Solve Deleted Files Keep Reappearing in Windows 10 - MiniToolSolve Deleted Files Keep Reappearing in Windows 10 - MiniToolMay 14, 2025 am 01:19 AM

This article focuses on the topic that deleted files keep reappearing in Windows 10, introducing the responsible reasons and feasible solutions.

How to Deactivate Windows 10/11 by Uninstalling Product Key - MiniToolHow to Deactivate Windows 10/11 by Uninstalling Product Key - MiniToolMay 14, 2025 am 01:18 AM

This post teaches you how to deactivate Windows 10/11 by removing product key or license. You can use that product key to activate another computer later if you want. For more computer tips and tricks, you can visit php.cn Software official website.

Instant Fixes for Error 0164: Memory Size DecreasedInstant Fixes for Error 0164: Memory Size DecreasedMay 14, 2025 am 01:15 AM

Some Windows users report that they are prompted by the error 0164 memory size decreased screen every time they boot the computer. What’s wrong with it? If you are in the same boat, congratulations! You’ve come to the right place! In this post from p

Best Fixes: This Page Isn't Available Right Now on Facebook - MiniToolBest Fixes: This Page Isn't Available Right Now on Facebook - MiniToolMay 14, 2025 am 01:11 AM

This Page Isn’t Available Right Now is an error message you may encounter when you visit Facebook using your web browser. In this php.cn post, we will list some effective methods you can try to get rid of this error.

Windows 11 KB5010414 Was Released with Many New Features - MiniToolWindows 11 KB5010414 Was Released with Many New Features - MiniToolMay 14, 2025 am 01:09 AM

Windows 11 KB5010414, a new optional update for Windows 11, is available now. Do you know what’s new and fixes in it? php.cn Software will show you this information in this post. Besides, it also tells you how to download and install it on your compu

How to Change Windows Update Settings in Windows 11? - MiniToolHow to Change Windows Update Settings in Windows 11? - MiniToolMay 14, 2025 am 01:08 AM

Want to pause Windows Update on your Windows 11 computer? Want to set active hours to arrange a computer restart to complete the update process? You need to know how to change Windows Update settings in Windows 11. This php.cn post will show you the

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

Video Face Swap

Video Face Swap

Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.

VSCode Windows 64-bit Download

VSCode Windows 64-bit Download

A free and powerful IDE editor launched by Microsoft

MantisBT

MantisBT

Mantis is an easy-to-deploy web-based defect tracking tool designed to aid in product defect tracking. It requires PHP, MySQL and a web server. Check out our demo and hosting services.

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Integrate Eclipse with SAP NetWeaver application server.

SecLists

SecLists

SecLists is the ultimate security tester's companion. It is a collection of various types of lists that are frequently used during security assessments, all in one place. SecLists helps make security testing more efficient and productive by conveniently providing all the lists a security tester might need. List types include usernames, passwords, URLs, fuzzing payloads, sensitive data patterns, web shells, and more. The tester can simply pull this repository onto a new test machine and he will have access to every type of list he needs.