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 相关文章推荐
jQuery绑定事件不执行但alert后可以正常执行
Jun 03 Javascript
node.js使用npm 安装插件时提示install Error: ENOENT报错的解决方法
Nov 20 Javascript
jquery图片播放浏览插件prettyPhoto使用详解
Dec 19 Javascript
JavaScript使用push方法添加一个元素到数组末尾用法实例
Apr 06 Javascript
详解JavaScript中void语句的使用
Jun 04 Javascript
JavaScript实现算术平方根算法-代码超简单
Sep 11 Javascript
jQuery取消特定的click事件
Feb 29 Javascript
老生常谈JavaScript中的this关键字
Oct 01 Javascript
vue-cli的webpack模板项目配置文件分析
Apr 01 Javascript
Js面试算法详解
Apr 08 Javascript
JS匿名函数内部this指向问题详析
May 10 Javascript
vue动态循环出的多个select出现过的变为disabled(实例代码)
Nov 10 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 魔术函数使用说明
2010/05/14 PHP
PHP常用技巧总结(附函数代码)
2012/02/04 PHP
PHP服务器页面间跳转实现方法
2012/08/02 PHP
通过php快速统计某个数据库中每张表的数据量
2012/09/04 PHP
ajax返回值中有回车换行、空格的解决方法分享
2013/10/24 PHP
使用pthreads实现真正的PHP多线程(需PHP5.3以上版本)
2014/05/05 PHP
实例讲解php实现多线程
2019/01/27 PHP
js 内存释放问题
2010/04/25 Javascript
简单实用的js调试logger组件实现代码
2010/11/20 Javascript
图片无缝滚动代码(向左/向下/向上)
2013/04/10 Javascript
JS实现点击图片在当前页面放大并可关闭的漂亮效果
2013/10/18 Javascript
深入了解Node.js中的一些特性
2014/09/25 Javascript
node.js中的events.emitter.removeAllListeners方法使用说明
2014/12/10 Javascript
AngularJS中的API(接口)简单实现
2016/07/28 Javascript
javascript实现一个网页加载进度loading
2017/01/04 Javascript
js css3实现图片拖拽效果
2017/03/04 Javascript
使用原生js+canvas实现模拟心电图的实例
2017/09/20 Javascript
原生JS实现小小的音乐播放器
2017/10/16 Javascript
详解基于Node.js的HTTP/2 Server实践
2018/05/31 Javascript
vue项目中使用百度地图的方法
2018/06/08 Javascript
vue通过cookie获取用户登录信息的思路详解
2018/10/30 Javascript
微信小程序防止多次点击跳转(函数节流)
2019/09/19 Javascript
vue和iview实现Scroll 数据无限滚动功能
2019/10/31 Javascript
nodejs各种姿势断点调试的方法
2020/06/18 NodeJs
探究Python的Tornado框架对子域名和泛域名的支持
2015/05/02 Python
django manage.py扩展自定义命令方法
2018/05/27 Python
python使用Thread的setDaemon启动后台线程教程
2020/04/25 Python
CSS3 :nth-child()伪类选择器实现奇偶行显示不同样式
2013/11/05 HTML / CSS
Julep官网:美容产品和指甲油
2017/02/25 全球购物
《莫高窟》教学反思
2014/02/25 职场文书
新春文艺演出主持词
2014/03/27 职场文书
《金孔雀轻轻跳》教学反思
2014/04/20 职场文书
2014年稽查工作总结
2014/12/20 职场文书
本科毕业答辩开场白
2015/05/27 职场文书
幼儿教师师德培训心得体会
2016/01/09 职场文书
Python Numpy库的超详细教程
2022/04/06 Python