首页 新闻 会员 周边

怎么动态获取颜色

0
悬赏园豆:160 [已解决问题] 解决于 2014-02-22 23:23
哎,图片传不上, javasript里面  ,比如说有一对
<ul>
  <c:forEach items="${categorys}" var="p">
    <li>${p.epcName }</li>
  </c:forEach>
</ul>
这个运行后
怎么去单击下就给这<li>赋上颜色,Css代码写好了  ,可以用,class的标签:current
那个迭代不用管
王苏的主页 王苏 | 初学一级 | 园豆:58
提问于:2014-02-22 17:32
< >
分享
最佳答案
0

按照楼上的做了下,正确哈,给楼上加分

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style type="text/css">
    .test{
        background-color:#FF0000;
    }
</style>

<script src="jquery-1.4.1.js"></script>
<script type="text/javascript">
    $(function(){
        $("ul li").click(function(){
            $("ul li").removeClass("test");
            $(this).addClass("test");
        });
        
    });
</script>

</head>

<body>
    <ul>
        <li>111111111111111</li>
        <li>22222222222222</li>
        <li>3333333333333</li>
    </ul>
</body>
</html>

收获园豆:160
C_林先森 | 初学一级 |园豆:60 | 2014-02-22 17:48

我看看啊  ,不知道有没有用啊 这个,,我那个<li>……</li>是循环出来的,代码回复上楼了,谢了啊

王苏 | 园豆:58 (初学一级) | 2014-02-22 18:34

@王苏: 循环出来的不得行,需要使用live函数

我把代码贴给你 

$("ul li").live("clike",function(){
            $("ul li").removeClass("test");
            $(this).addClass("test");
        });

这样就可以了,你试哈

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 21:11

@1061569482: 

<script type="text/javascript">
$(function(){
$("ul li").live("clike",function(){
$("ul li").removeClass("current");
$(this).addClass("current");
});
});
</script>

 

 

 

<a href="register.jsp">注册</a><a href="GuestBookQian">留言</a></div>

<div class="navbar">
<ul class="clearfix" id="ulNavigate">

<li class="current"><a href="index.jsp">首页</a></li>
<c:forEach items="${categorys}" var="p">
<li><a href="FenLeiShopping?id=${p.epcId }" >${p.epcName }</a></li>
</c:forEach>

</ul>

</div>

 

刷新后还是没反应??  单击那个鞋包 ,图书影音都没有

王苏 | 园豆:58 (初学一级) | 2014-02-22 21:38

@王苏: 把你的js代码贴出来看看啊

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 21:41

@1061569482: 

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<html>
<head>
<base href="<%=basePath%>"/>

<title>My JSP 'Top.jsp' starting page</title>

<meta http-equiv="pragma" content="no-cache"/>
<meta http-equiv="cache-control" content="no-cache"/>
<meta http-equiv="expires" content="0"/>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3"/>
<meta http-equiv="description" content="This is my page"/>
<link rel="stylesheet" type="text/css" href="../css/style.css"/>
</head>
<script type="text/javascript">
$(function(){
$("ul li").live("clike",function(){
$("ul li").removeClass("current");
$(this).addClass("current");
});
});
</script>
<body>
<div id="header" class="wrap">
<div id="logo"><img src="images/logo.gif" /></div>
<div class="help"><a href="ShoppingCard" class="shopping">购物车</a>
<c:if test="${User!=null}">
尊敬的 ${User.eu_username} <a href="qieDuan.jsp">退出</a>
<c:if test="${User.eu_status==2}">
<a href="manage/index.jsp">管理后台</a>
</c:if>
</c:if>
<c:if test="${User==null}">
<a href="login.jsp">登录</a>
</c:if>

<a href="register.jsp">注册</a><a href="GuestBookQian">留言</a></div>
<!-- 获取分类信息循坏 -->
<div class="navbar">
<ul class="clearfix" id="ulNavigate">
<li class="current"><a href="index.jsp">首页</a></li>
<c:forEach items="${categorys}" var="p">
<li><a href="FenLeiShopping?id=${p.epcId }" >${p.epcName }</a></li>
</c:forEach>
</ul>

</div>
</div>
<div id="childNav">
<div class="wrap">
<ul class="clearfix">
<c:forEach items="${categorys}" var="cls" >
<c:forEach items="${cls.priduct}" var="cl">
<li class="first"><a href="FenLeiShopping?cid=${cl.epcId }">${cl.epcName }</a></li>
</c:forEach>
</c:forEach>
<li class="last"><a href="">Investor Relations</a></li>
</ul>
</div>
</div>
</body>
</html>

王苏 | 园豆:58 (初学一级) | 2014-02-22 21:43

@王苏: 你没有导入js的库啊<script src="jquery-1.4.1.js"></script>

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 21:44

@1061569482: 只要这样导入就行了?

我马上搞

王苏 | 园豆:58 (初学一级) | 2014-02-22 21:45

@王苏: 是的,路径要对哈,不然也不得行

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 21:46

@1061569482: jquery-1.4.1.js  这个是要自己写吗   ?写什么?

王苏 | 园豆:58 (初学一级) | 2014-02-22 21:48

@王苏: 还是没出来

王苏 | 园豆:58 (初学一级) | 2014-02-22 21:48

@王苏:这是jquery的一个库文件,你没有吗?

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 21:49

@1061569482: 这下完了  ,我丫还没学 ,还得下一个学期才有   我去百度下   我用的是MyEclipse软件

王苏 | 园豆:58 (初学一级) | 2014-02-22 21:51

@王苏: 哦,这样,需呀下载一个jquery的js库,导入进去,就可以了

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 21:52

@1061569482: @王苏: 哦,这样,需呀下载一个jquery的js库,导入进去,就可以了,我给你发的代码是1.4的库,

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 21:53

@1061569482:百度有吧

王苏 | 园豆:58 (初学一级) | 2014-02-22 21:54

@王苏: 有的哈

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 21:54

@1061569482: 是这个吗

王苏 | 园豆:58 (初学一级) | 2014-02-22 22:01

@王苏: 是的

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 22:02

@1061569482: 

 

你看  ,我导入了   ,还需要导什么东西不 ,还没反应

王苏 | 园豆:58 (初学一级) | 2014-02-22 22:04

 @王苏: 你在$(function(){

   alert("fsdsdd");

 });

看看有没有弹窗

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 22:09

@1061569482: 弹了   fsdsdd

王苏 | 园豆:58 (初学一级) | 2014-02-22 22:14

@王苏: 你的js代码改改,

$(function(){
  $("#ulNavigate li").live("clike",function(){
    $("ul li").removeClass("current");
    $(this).addClass("current");
  });
});

试哈

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 22:18

@王苏: ??怎么粘贴 这么多代码

王苏 | 园豆:58 (初学一级) | 2014-02-22 22:22

@王苏: 我都不晓得怎么说了,我说的是在jsp页面里面改

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 22:28

@1061569482: 

 是这样吧 

王苏 | 园豆:58 (初学一级) | 2014-02-22 22:31

@王苏: ok

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 22:32

@1061569482: 没有用哦

王苏 | 园豆:58 (初学一级) | 2014-02-22 22:32

@王苏: 

 

 

怎么点还是老样   

王苏 | 园豆:58 (初学一级) | 2014-02-22 22:34

@王苏: 你吧这个网页运行后的源代码给我一个呢

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 22:38

@1061569482: 好  ,稍等下    我右击查看源 没反应啊    IE浏览器

王苏 | 园豆:58 (初学一级) | 2014-02-22 22:44

@1061569482: 

   
   
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  <html xmlns="http://www.w3.org/1999/xhtml">
  <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>易买网 - 首页</title>
  <link type="text/css" rel="stylesheet" href="css/style.css" />
  <script type="text/javascript" src="scripts/function.js"></script>
  </head>
  <body>&nbsp;
   
   
  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
   
  <html>
    <head>
      <base href="http://localhost:8080/EasyBys/"/>
     
      <title>My JSP 'Top.jsp' starting page</title>
     
  <meta http-equiv="pragma" content="no-cache"/>
  <meta http-equiv="cache-control" content="no-cache"/>
  <meta http-equiv="expires" content="0"/>   
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"/>
  <meta http-equiv="description" content="This is my page"/>
  <link rel="stylesheet" type="text/css" href="../css/style.css"/>
    </head>
    <script src="jquery-1.3.2.min.js"></script>
    <script type="text/javascript">
      $(function(){
    $("#ulNavigate li").live("clike",function(){
      $("ul li").removeClass("current");
      $(this).addClass("current");
    });
  });
      
      </script>
    <body>
     <div id="header" class="wrap">
  <div id="logo"><img src="images/logo.gif" /></div>
  <div class="help"><a href="ShoppingCard" class="shopping">购物车</a>
   
  尊敬的 wa <a href="qieDuan.jsp">退出</a>
   
  <a href="manage/index.jsp">管理后台</a>
   
   
   
   
  <a href="register.jsp">注册</a><a href="GuestBookQian">留言</a></div>
  <!-- 获取分类信息循坏 -->
  <div class="navbar">
  <ul class="clearfix" id="ulNavigate">
  <li class="current"><a href="index.jsp">首页</a></li>
   
  <li><a href="FenLeiShopping?id=95" >鞋包</a></li>
   
  <li><a href="FenLeiShopping?id=89" >图书音像</a></li>
   
  <li><a href="FenLeiShopping?id=90" >图书</a></li>
   
  <li><a href="FenLeiShopping?id=93" >电器</a></li>
   
  </ul>
   
  </div>
  </div>
  <div id="childNav">
  <div class="wrap">
  <ul class="clearfix">
   
   
  <li class="first"><a href="FenLeiShopping?cid=98">LV包</a></li>
   
   
   
  <li class="first"><a href="FenLeiShopping?cid=91">手机数码</a></li>
   
  <li class="first"><a href="FenLeiShopping?cid=99">光碟</a></li>
   
   
   
  <li class="first"><a href="FenLeiShopping?cid=100">红楼梦</a></li>
   
  <li class="first"><a href="FenLeiShopping?cid=92">音乐</a></li>
   
  <li class="first"><a href="FenLeiShopping?cid=97">西游记</a></li>
   
   
   
  <li class="first"><a href="FenLeiShopping?cid=96">电视机</a></li>
   
   
  <li class="last"><a href="">Investor Relations</a></li>
  </ul>
  </div>
  </div>
    </body>
  </html>
   
  <div id="main" class="wrap">
  <div class="lefter">
  <!-- left页面 -->
   
   
   
   
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  <html>
    <head>
      <base href="http://localhost:8080/EasyBys/">
     
      <title>My JSP 'left.jsp' starting page</title>
     
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">   
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  <meta http-equiv="description" content="This is my page">
  <!--
  <link rel="stylesheet" type="text/css" href="styles.css">
  -->
   
    </head>
   
    <body>
     
  <div class="box">
  <h2>商品分类</h2>
  <dl>
   
  <dt parid="0">鞋包</dt>
   
  <dd><a href="ProductListQian?id=98">LV包</a></dd><!-- 建一个servler页面查询 -->
   
   
  <dt parid="0">图书音像</dt>
   
  <dd><a href="ProductListQian?id=91">手机数码</a></dd><!-- 建一个servler页面查询 -->
   
  <dd><a href="ProductListQian?id=99">光碟</a></dd><!-- 建一个servler页面查询 -->
   
   
  <dt parid="0">图书</dt>
   
  <dd><a href="ProductListQian?id=100">红楼梦</a></dd><!-- 建一个servler页面查询 -->
   
  <dd><a href="ProductListQian?id=92">音乐</a></dd><!-- 建一个servler页面查询 -->
   
  <dd><a href="ProductListQian?id=97">西游记</a></dd><!-- 建一个servler页面查询 -->
   
   
  <dt parid="0">电器</dt>
   
  <dd><a href="ProductListQian?id=96">电视机</a></dd><!-- 建一个servler页面查询 -->
   
   
  </dl>
  </div>
  <div class="spacer"></div>
    </body>
  </html>
   
  <div class="spacer"></div>
  <!-- 最近浏览 -->
   
   
   
   
   
   
   
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  <html>
    <head>
      <base href="http://localhost:8080/EasyBys/">
     
      <title>My JSP 'Cookies.jsp' starting page</title>
     
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">   
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  <meta http-equiv="description" content="This is my page">
  <!--
  <link rel="stylesheet" type="text/css" href="styles.css">
  -->
   
    </head>
   
    <body>
   
     <div class="last-view">
  <h2>最近浏览</h2>
  <dl class="clearfix">
   
  </dl>
  </div>
    </body>
  </html>
   
  </div>
  <div class="main">
  <div class="price-off">
  <h2>今日特价</h2>
  <ul class="product clearfix">
   
   
  <li>
  <dl>
  <dt><a href="ProductViewQian?id=91" target="_blank"><img src="upload/1392990935688.jpg" /></a></dt>
  <dd class="title"><a href="ProductViewQian?id=91" target="_blank"></a></dd>
  <dd class="price">¥3.0</dd>
  </dl>
  </li>
   
  <li>
  <dl>
  <dt><a href="ProductViewQian?id=88" target="_blank"><img src="upload/1392990968394.jpg" /></a></dt>
  <dd class="title"><a href="ProductViewQian?id=88" target="_blank"><p>范德萨</p>
  </a></dd>
  <dd class="price">¥66.0</dd>
  </dl>
  </li>
   
  <li>
  <dl>
  <dt><a href="ProductViewQian?id=89" target="_blank"><img src="upload/1392889744426.jpg" /></a></dt>
  <dd class="title"><a href="ProductViewQian?id=89" target="_blank"><p>fafd</p>
  </a></dd>
  <dd class="price">¥6.0</dd>
  </dl>
  </li>
   
   
   
   
   
   
  </ul>
  </div>
  <div class="side">
  <!-- 公告包含 -->
   
   
   
   
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  <html>
    <head>
      <base href="http://localhost:8080/EasyBys/">
     
      <title>My JSP 'GongGaoBaoHan.jsp' starting page</title>
     
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">   
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  <meta http-equiv="description" content="This is my page">
  <!--
  <link rel="stylesheet" type="text/css" href="styles.css">
  -->
   
    </head>
   
    <body>
    <div class="news-list">
  <h4>最新公告</h4>
  <ul>
   
  <li><a href="NewView?id=26" target="_blank">e</a></li>
   
  <li><a href="NewView?id=30" target="_blank">qq</a></li>
   
  <li><a href="NewView?id=31" target="_blank">ew</a></li>
   
  <li><a href="NewView?id=32" target="_blank">fdsdf</a></li>
   
  <li><a href="NewView?id=28" target="_blank">fds</a></li>
   
  <li><a href="NewView?id=29" target="_blank">fd</a></li>
   
  </ul>
  </div>
  <div align="center"></div>
    </body>
  </html>
   
  <div class="spacer"></div>
  <!-- 新闻包含 -->
   
   
   
   
   
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  <html>
    <head>
      <base href="http://localhost:8080/EasyBys/">
     
      <title>My JSP 'NewXin.jsp' starting page</title>
     
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">   
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  <meta http-equiv="description" content="This is my page">
  <!--
  <link rel="stylesheet" type="text/css" href="styles.css">
  -->
   
    </head>
   
    <body>
   
    <div class="news-list">
  <h4>新闻动态</h4>
  <ul>
   
  <li><a href="NewView?nid=21" target="_blank">gang</a></li>
   
  </ul>
   
  </div>
  <div align="center"></div>
    </body>
  </html>
   
  </div>
  <div class="spacer clear"></div>
  <div class="hot">
  <h2>热卖推荐</h2>
  <ul class="product clearfix">
   
  <li>
  <dl>
  <dt><a href="ProductViewQian?id=91"  target="_blank"><img src="upload/1392990935688.jpg" /></a></dt>
  <dd class="title"><a href="ProductViewQian?id=91" target="_blank"></a></dd>
  <dd class="price">¥3.0</dd>
  </dl>
  </li>
   
  <li>
  <dl>
  <dt><a href="ProductViewQian?id=88"  target="_blank"><img src="upload/1392990968394.jpg" /></a></dt>
  <dd class="title"><a href="ProductViewQian?id=88" target="_blank"><p>范德萨</p>
  </a></dd>
  <dd class="price">¥66.0</dd>
  </dl>
  </li>
   
  <li>
  <dl>
  <dt><a href="ProductViewQian?id=89"  target="_blank"><img src="upload/1392889744426.jpg" /></a></dt>
  <dd class="title"><a href="ProductViewQian?id=89" target="_blank"><p>fafd</p>
  </a></dd>
  <dd class="price">¥6.0</dd>
  </dl>
  </li>
   
  </ul>
  </div>
  </div>
  <div class="clear"></div>
  </div>
   
   
   
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  <html>
    <head>
      <base href="http://localhost:8080/EasyBys/">
     
      <title>My JSP 'foot.jsp' starting page</title>
     
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="expires" content="0">   
  <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
  <meta http-equiv="description" content="This is my page">
  <!--
  <link rel="stylesheet" type="text/css" href="styles.css">
  -->
   
    </head>
   
    <body>
  <div id="footer">
  Copyright &copy; 2010 北大青鸟 All Rights Reserved. 京ICP证1000001号
  </div>
    </body>
  </html>
   
  </body>
  </html>

 

 

王苏 | 园豆:58 (初学一级) | 2014-02-22 22:49

@王苏:好长哦   在最顶上

王苏 | 园豆:58 (初学一级) | 2014-02-22 22:52

@王苏: 

$(function(){
  $("#ulNavigate li").live("clike",function(){
    $("ulNavigate li").removeClass("current");
    $(this).addClass("current");
  });
});

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 23:15

@1061569482: $(function(){
  $("#ulNavigate li").live("clike",function(){
    $("#ulNavigate li").removeClass("current");
    $(this).addClass("current");
  });
});

刚错了,建议你先学一下再弄,你这个看起来很麻烦,

C_林先森 | 园豆:60 (初学一级) | 2014-02-22 23:20

@1061569482: 还是没出来  ,好 吧   ,辛苦你了 ,

王苏 | 园豆:58 (初学一级) | 2014-02-22 23:24
其他回答(1)
0
$("ul li").click(function(){
    $("ul li").removeClass("current");
    $(this).addClass("current");
});

试试看

I,Robot | 园豆:9783 (大侠五级) | 2014-02-22 17:37

<script type="text/javascript">
$("ul li").click(function(){
$("ul li").removeClass("current");
$(this).addClass("current");
});
</script>

把它放在了<script type="text/javascript">里面,   刷新点击还是不出来

支持(0) 反对(0) 王苏 | 园豆:58 (初学一级) | 2014-02-22 18:21

<div class="navbar">
<ul class="clearfix">

<li class="current"><a href="index.jsp">首页</a></li>
<c:forEach items="${categorys}" var="p">
<li><a href="FenLeiShopping?id=${p.epcId }" >${p.epcName }</a></li>
</c:forEach>

</ul>
</div>

 

 

 

这是相关源代码 

支持(0) 反对(0) 王苏 | 园豆:58 (初学一级) | 2014-02-22 18:24

出了首页这个<li>首页</li>这个是手动打上去的,其它是循环迭代出来的,代码回复给你了,欲哭无泪 ,做了好久

支持(0) 反对(0) 王苏 | 园豆:58 (初学一级) | 2014-02-22 18:32

@王苏: 

$(function(){
$("ul li").click(function(){
    $("ul li").removeClass("current");
    $(this).addClass("current");
});

});

代码是引用了jQuery的

支持(0) 反对(0) I,Robot | 园豆:9783 (大侠五级) | 2014-02-22 19:26

@DiQiSoft.Com:这个 JQuery貌似还没学    暂学了java javascript js

支持(0) 反对(0) 王苏 | 园豆:58 (初学一级) | 2014-02-22 21:23
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册