使用JavaScript構建JSON格式字串

來源:互聯網
上載者:User

如果你現在正在使用Restful API,並且你需要通過web項目來構建json格式字串的響應,那麼這篇文章將協助你使用javascript來建立json格式字串。這是非常有用的,我們將通過jQuery外掛程式$.toJSON把資料對象轉換為json格式。使用JavaScript構建JSON格式字串 JavaScript代碼:在這裡包含了javascript代碼。$(“#form”).submit(function(){}- delete_button是form標籤的ID,我們通過element.val()調用表單輸入框的值。代碼如下: <script src="jquery.min.js"></script><script src="jquery.json-2.2.js"></script><script src="GetPostAjax.js"></script><script type="text/javascript">$(document).ready(function(){$("#form").submit(function(e){e.preventDefault();var username,email,password,gender;username=$("#username").val();email=$("#email").val();password=$("#username").val();gender=$("#gender").val(); if(username.length>0 && email.length>0 && password.length>0 &&gender.length>0){//Creating Objectsvar request = new Object();var userDetails = new Object();var user = new Object();var websites=new Array(); user.name=username;user.email=email;user.password=password;user.gender=gender; //Array Pushif(website1.length>0)websites.push(website1);if(website2.length>0)websites.push(website2);if(website3.length>0)websites.push(website3); user.websites=websites; userDetails.user = user;request.userDetails = userDetails; var jsonfy = $.toJSON(request);// Encodes special charactersvar encodedata = 'jsondata='+encodeURIComponent(jsonfy); //Ajax Callvar url='website API URL';post_data(url,encodedata, function(data) {alert("Success");}); } }); });</script"> HTML代碼:<form method='post' action='' id='form'>Name<input type='text' name='username' id='username'  />Email<input type='text' name='email' id='email' />Password<input type='text' name='password' id='password' />Gender<select name='gender' id='gender'><option value='male'>Male</option><option value='female'>Female</option></select>Websites<input type='text' id='website1' /><input type='text' id='website2' /><input type='text' id='website3' /><input type='submit' id='submit'/></form> JSON輸出{"userDetails":{"user":{"name":"Srinivas Tamada","email":"srinivas@9lessons.info","password":"Srinivas Tamada","gender":"male","websites":["www.software8.co","www.heatpress123.net","www.0769zzw.com"]}}}JSON Encoded 對特殊字元進行編碼,會把以下字元進行編碼:, / ? : @ & = + $ # jsondata=%7B%22userDetails%22%3A%7B%22user%22%3A%7B%22name%22%3A%22Srinivas%20Tamada%22%2C%22email%22%3A%22srinivas%409lessons.info%22%2C%22password%22%3A%22Srinivas%20Tamada%22%2C%22gender%22%3A%22male%22%2C%22websites%22%3A%5B%22www.9lessons.info%22%2C%22www.egglabs.in%22%2C%22www.fglogin.com%22%5D%7D%7D%7DGetPostAjax.js 這裡定義了jquery的ajax要求方法。 function post_data(url,encodedata, success){$.ajax({type:"POST",url:url,data :encodedata,dataType:"json",restful:true,contentType: 'application/json',cache:false,timeout:20000,async:true,beforeSend :function(data) { },success:function(data){success.call(this, data);},error:function(data){alert("Error In Connecting");}});}

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.