javascript+ajax实现产品页面加载信息


Posted in Javascript onJuly 09, 2015

js

//加载页面

//加载产品列表
function GetProductList() {
  function PostParam(param) {
    param.key = "lm324";
    return param;
  }
  var PostExecParam = {
    ClassName: "AnxinE.BLL.Product.ProductInfoBLL",
    MethodName: "Search",
    ParamModelName: "AnxinE.Model.Product.ProductInfoParam",
    onRequest: PostParam,
    onResponse: function (result) {
      if (result != null) {
        var html = "";
        //汇率判断
        //<td>" + (result.SupplierProductList[i].ProductList[j].PriceUSD.toString() == '0' ? 1 : result.SupplierProductList[i].ProductList[j].USDPriceList[0].MinQuantity) + ":" + result.SupplierProductList[i].ProductList[j].PriceUSD + "</td>
        //展示搜索-产品信息列表
        for (var i = 0; i < result.SupplierProductList.length; i++) {
          for (var j = 0; j < result.SupplierProductList[i].ProductList.length; j++) {
            //if (result.SupplierProductList[i].ProductList[j].PriceUSD!=null) {
            //}
            html += "<tr><td>" + result.SupplierProductList[i].ProductList[j].Model + "</td><td>" + result.SupplierProductList[i].ProductList[j].Manufacturer + "</td><td>" + (result.SupplierProductList[i].ProductList[j].Quantity) + "</td><td>" + result.SupplierProductList[i].ProductList[j].ShipDays + "</td><td>" + result.SupplierProductList[i].ProductList[j].MinOrderQuantity + "+</td><td>" + result.SupplierProductList[i].ProductList[i].DeliveryPoint + "</td><td>" + result.SupplierProductList[i].ProductList[j].PriceUSD + "</td><td>" + result.SupplierProductList[i].ProductList[j].PriceCNY + "</td><td><a href=''>加入购物车</td></tr><br/>";
          }
        }
        //展示搜索--品牌列表
        var html2 = "<h2 class='cur1'>全部</h2>";
        if (result.ManufacturerList.length > 0) {
          for (var i = 0; i < result.ManufacturerList.length ; i++) {
            if (result.ManufacturerList[i].KeyName != null) {
              if (i < 5) {
                html2 += "<h2 href='javascript:void(0);' id='" + result.ManufacturerList[i].KeyName + "' onclick='Trademark(this)' >" + result.ManufacturerList[i].KeyName + "</h2>";
              }
            }
          }
          //<a href="javascript:void(0);" id="regain_r2">收回</a>
          html2 += "<a href='javascript:void(0);' id='more_r2' onclick='More_r2()'>更多+</a>";
        }
        //不删除第一个内容,将产品信息表追加
        $("#r2_text2").not($(".cur1")).empty();
        $("#r2_text2").append(html2);
        //改写品牌行
        $(".tr3").empty();
        $(".tr3").append(html);
      }
    }
  };
  $.ajaxRequest(PostExecParam);
};

.cshtml

<div class="secect_r">
    <div class="top_right">
      <ul>
        <li class="list1"><img src="~/MvcImages/ycysqd/sx_03.gif" /><p>筛选</p></li>
        <li class="list2"><a href="">集成电路</a>>></li>
        @*<li class="list3"><a>INFINEON</a><span>×</span></li>
        <li class="list3"><a>100-1000件</a><span>×</span></li>
        <li class="list3"><a>国内</a><span>×</span></li>*@
      </ul>
      <div class="r1"><h1>型号:</h1><div class="text1"><input id="typeofproduct" type="text" value="输入型号" /></div></div>
      <div class="r2"><h1>品牌:</h1><div class="text2" id="r2_text2"><h2 class="cur1">全部</h2><h2>FTDI</h2><h2>WIINET</h2><h2>3M-STATIC CONTROL SOLUTIONS</h2><h2>AAVID THERMALLOY</h2><h2>ALLIANCE</h2><a href="javascript:void(0);" id="more_r2" onclick="More_r2()">更多+</a></div><div class="text2" id="r2_text2_2" style="display:none"></div></div>
      <div class="r3"><h1>库存数量:</h1><div class="text1"><input type="text" class="ChangeInventoryquantity" id="startnumber" value="1000" /></div><a>-</a><div class="text2"><input class="ChangeInventoryquantity" id="endnumber" type="text" value="1000000" /></div><a>件</a></div>
      <div class="r4"><h1>交货地:</h1><div class="text2"><h2 class="cur1">全部</h2><h2 onclick="Trademark(this)">国内</h2><h2 onclick="Trademark(this)">香港</h2></div></div>
    </div>

  </div>
  <table class="bottom_right">
    <tr class="tr1">
      <td class="td1"><p>型号</p></td>
      <td class="td2"><p>品牌</p></td>
      <td class="td3"><p>库存数量</p></td>
      <td class="td4"><p>货期</p></td>
      <td class="td5"><p>起订量</p></td>
      <td class="td6"><p>交货地</p></td>
      <td class="td7"><p>香港交货</p></td>
      <td class="td8"><p>国内交货</p></td>
      <td class="td9"><p>操作</p></td>
    </tr>
    <tr class="tr2">
      <td></td>
      <td></td>
      <td></td>
      <td><p>(工作日)</p></td>
      <td></td>
      <td></td>
      <td></td>
      <td><p>(含17%税)</p></td>
      <td></td>
    </tr>

    <tbody class="tr3"></tbody>

  </table>

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
javascript时间自动刷新实现原理与步骤
Jan 06 Javascript
DWZ刷新dialog解决方法
Mar 03 Javascript
ScrollDown的基本操作示例
Jun 09 Javascript
JavaScript实现页面5秒后自动跳转的方法
Apr 16 Javascript
小白谈谈对JS原型链的理解
May 03 Javascript
js实现获取鼠标当前的位置
Dec 14 Javascript
javascript 中事件冒泡和事件捕获机制的详解
Sep 01 Javascript
React根据宽度自适应高度的示例代码
Oct 11 Javascript
React组件中的this的具体使用
Feb 28 Javascript
ionic2中使用自动生成器的方法
Mar 04 Javascript
webpack的CSS加载器的使用
Sep 11 Javascript
Javascript模拟实现new原理解析
Mar 03 Javascript
浅谈JavaScript中null和undefined
Jul 09 #Javascript
兼容各大浏览器的JavaScript阻止事件冒泡代码
Jul 09 #Javascript
JavaScript包装对象使用详解
Jul 09 #Javascript
jquery实现表单验证并阻止非法提交
Jul 09 #Javascript
jQuery实现tab选项卡效果的方法
Jul 08 #Javascript
jQuery实现类似淘宝网图片放大效果的方法
Jul 08 #Javascript
javascript实现10个球随机运动、碰撞实例详解
Jul 08 #Javascript
You might like
PHP编写daemon process 实例详解
2016/11/13 PHP
laravel 使用auth编写登录的方法
2019/09/30 PHP
一起来写段JS drag拖动代码
2010/12/09 Javascript
javascript静态页面传值的三种方法分享
2013/11/12 Javascript
jQuery知识点整理
2015/01/30 Javascript
JavaScript事件委托实例分析
2015/05/26 Javascript
理解javascript定时器中的单线程
2016/02/23 Javascript
JavaScript学习笔记之取数组中最大值和最小值
2016/03/23 Javascript
AngularJs 动态加载模块和依赖
2016/09/15 Javascript
JS中绑定事件顺序(事件冒泡与事件捕获区别)
2017/01/24 Javascript
JS数组去重(4种方法)
2017/03/27 Javascript
JS实现的找零张数最小问题示例
2017/11/28 Javascript
用Node编写RESTful API接口的示例代码
2018/07/04 Javascript
vue3.0 CLI - 2.6 - 组件的复用入门教程
2018/09/14 Javascript
electron-vue利用webpack打包实现多页面的入口文件问题
2019/05/12 Javascript
借助云开发实现小程序短信验证码的发送
2020/01/06 Javascript
JavaScript 链表定义与使用方法示例
2020/04/28 Javascript
[01:08:10]2014 DOTA2国际邀请赛中国区预选赛 SPD-GAMING VS LGD-CDEC
2014/05/22 DOTA
利用Python绘制MySQL数据图实现数据可视化
2015/03/30 Python
Windows下为Python安装Matplotlib模块
2015/11/06 Python
Python调用SQLPlus来操作和解析Oracle数据库的方法
2016/04/09 Python
python2.7实现爬虫网页数据
2018/05/25 Python
Django中自定义模型管理器(Manager)及方法
2019/09/23 Python
利用PyTorch实现VGG16教程
2020/06/24 Python
python 多线程中join()的作用
2020/10/29 Python
python 生成正态分布数据,并绘图和解析
2020/12/21 Python
中间件分为哪几类
2012/03/14 面试题
公积金转移接收函
2014/01/11 职场文书
四风查摆问题自查报告
2014/10/10 职场文书
综治维稳工作汇报
2014/10/27 职场文书
2015年护士医德医风自我评价
2015/03/03 职场文书
工程技术负责人岗位职责
2015/04/13 职场文书
消防演习通知
2015/04/25 职场文书
《中国古代诗歌散文欣赏》高中语文教材
2019/08/20 职场文书
CSS作用域(样式分割)的使用汇总
2021/11/07 HTML / CSS
JavaScript实现音乐播放器
2022/08/14 Javascript