小部分ajax的控制,两种实现状态,两段js(纯属自己做给自己看的)

<div class="houseList" ><div class="one111_" id="one111_">
<h3>一/二</h3>
<ul class="list">
<li >
<span class="fleft">一:</span>
<!--
EOT;
$sel = $_viewer->plate ? ‘class="area"‘ : ‘‘;
$areaall = !$_viewer->areatype ? ‘abc‘ : ‘‘;
print <<<EOT
-->
<!--
EOT;
foreach ( $_viewer->area as $key=>$value ) {
$sel = ($_viewer->areatype == $key) ? ‘class="act"‘ : ‘‘;
print<<<EOT
-->
<li style="display:inline"><a id="one3_{$key}">{$value}</a></li>
<!--
EOT;
}
print<<<EOT
-->
</li>
<li>
<span class="fleft">二:</span>
<!--
EOT;
$sel = $_viewer->plate ? ‘class="area"‘ : ‘‘;
$areaall = !$_viewer->areatype ? ‘abc‘ : ‘‘;
print <<<EOT
-->
<!--
EOT;
foreach ( $_viewer->area as $key=>$value ) {
$sel = ($_viewer->areatype == $key) ? ‘class="act"‘ : ‘‘;
print<<<EOT
-->
<li style="display:inline"><a id="one4_{$key}">{$value}</a></li>
<!--
EOT;
}
print<<<EOT
-->
</li>
</ul>

</div>

<div id="areas" style="display:none;">
<!--
EOT;
foreach ( $_viewer->steets as $key=>$value ) {
print<<<EOT
-->
<div class="areas{$key}">
<!--
EOT;
foreach($value as $streets){
print<<<EOT
-->
<a href="index-htmx-m-house-q-sale-act--options-
{$_viewer->options[areatype]}opt.areatype.{$key}.{$_viewer->options[platetype]}opt.platetype.{$streets[‘streetid‘]}.html">{$streets[‘name‘]}</a>
<!--
EOT;
}
print<<<EOT
-->
</div>
<!--
EOT;
}
print<<<EOT
-->
</div>

<div class="tab1" id="tab1">
<div id="footer" class="regionalLinks" onclick="setTab(‘one‘,0)">
<ul>
<li><a href="javascript:scroll(0,0)">返回顶部 </a></li>
<!--
EOT;
$sel = $_viewer->plate ? ‘class="area"‘ : ‘‘;
$areaall = !$_viewer->areatype ? ‘abc‘ : ‘‘;
print <<<EOT
-->
<li><a id="one1" onmouseover="setTab(‘one‘,1)" style="height: 36px;">一</a>
<div id="con_one_1" class="xiala_list" style="display: none; z-index: 1; margin-left: 0px; width: 460px; padding: 5px; top: 61px; left: -40px;">
<!--
EOT;
$sel = ‘‘;
foreach ( $_viewer->area as $key=>$value ) {
$sel = ($_viewer->areatype == $key) ? ‘class="act"‘ : ‘‘;
print<<<EOT
-->
<a href="index-htmx-m-house-q-sale-act--options-{$_viewer->options[areatype]}opt.areatype.{$key}.html" {$sel}>{$value}</a>
<!--
EOT;
}
print<<<EOT
-->
</div>
</li>
<li>
<a id="one2" onmouseover="setTab(‘one‘,2)" style="height: 36px;">二</a>
<div id="con_one_2" class="xiala_list" style="display: none; z-index: 1; margin-left: 0px; width: 460px; padding: 5px; top: 61px; left: -40px;">
<!--
EOT;
$sel = ‘‘;
foreach ( $_viewer->area as $key=>$value ) {
$sel = ($_viewer->areatype == $key) ? ‘class="act"‘ : ‘‘;
print<<<EOT
-->
<a href="index-htmx-m-house-q-hire-act--options-{$_viewer->options[areatype]}opt.areatype.{$key}.html" {$sel}>{$value}</a>
<!--
EOT;
}
print<<<EOT
-->
</div>
</li>
</ul>
</div>

<script type="text/javascript">
function setTab(name,cursel){
cursel_0=cursel;
for(var i=1; i<=links_len; i++){
var regionalLinks = document.getElementById(name+i);
var menudiv = document.getElementById("con_"+name+"_"+i);
if(i==cursel){
//regionalLinks.className="off";
menudiv.style.display="block";
}
else{
//regionalLinks.className="";
menudiv.style.display="none";
}
}
}

onload=function(){
var links = document.getElementById("tab1").getElementsByTagName(‘li‘)
links_len=links.length;
for(var i=0; i<links_len; i++){
links[i].onmouseover=function(){
//clearInterval(iIntervalId);
this.onmouseout=function(){
}
}
}
}

$(function(){
$("a[id^=‘one111_‘],a[id^=‘one1_‘],a[id^=‘one2_‘],a[id^=‘one3_‘],a[id^=‘one4_‘]").mouseover(function(){
var area=$(this).attr(‘id‘);
area=area.split(‘_‘);
var areaid=area[1];
if($(this).parent().find("div.xiala_list").length<1)
{
$(this).after(‘<div class="xiala_list"></div>‘);
$(this).next("div.xiala_list").html($("div#areas div.areas"+areaid).html());
}

/*当点击另一个的时候,前一个消失*/
$(this).next("div.xiala_list").css(‘display‘,‘block‘).parents().siblings().find("div.xiala_list").hide();
})
$("body.one111_,div.one111_").click(function(){
$("div.xiala_list").css(‘display‘,‘none‘);
});
});
</script>

时间: 2025-01-08 06:25:25

小部分ajax的控制,两种实现状态,两段js(纯属自己做给自己看的)的相关文章

20Mybatis_订单商品数据模型_一对一查询——resultType和resultMap两种方式以及两种方式的总结

上一篇文章分析了数据模型,这篇文章就给出一个需求,这个需求是一对一查询,并完成这个需求. -------------------------------------------------------------------------------------------------------------------------------------------- 需求: 查询订单信息,关联查询创建订单的用户信息. 记住:用Mybatis开发的顺序就是 1.写sql语句 2.创建pojo类来

Json转list,两种包,两种方式

1.使用fastjson 对于json串大小写没什么要求,测试的时候,我把javaBean属性设置成和json串一样的大小写,代码如下: package com.myTest.json.test1; import java.util.ArrayList; import java.util.List; import com.alibaba.fastjson.JSON; public class app1 { public static void main(String[] args) { Stri

两种人生状态

最近自己的心情都比较浮躁,沉不下心来看书,在技术方面的也没有什么大的进步.快临近大四了,可能是自己这段时间一直在考研和找工作这两者之间的犹豫不决而导致的吧! 为什么自己会这这两个选择之中犹豫不决呢,那是因为我的目标不是很明确,心中没有远大的志向.而现在恰恰是要做出人生中比较重要的决定时候,因为自己也不知道自己该做什么,心态也没有调整好,所以才会犹豫不决,才会有现在的浮躁. 我觉得每个人都会有两个状态 1.有远大志向:2.无远大志向 我说无远大志向指的并不是指没有任何目标.整天无所谓.不求上进的,

thinkphp的钩子的两种配置和两种调用方法

thinkphp的钩子行为类是一个比较难以理解的问题,网上有很多写thinkphp钩子类的文章,我也是根据网上的文章来设置thinkphp的钩子行为的,但根据这些网上的文章,我在设置的过程中,尝试了十几次都没有成功,不过,我还是没有放弃,最后还是在一边调节细节,一边试验的过程中实现了钩子行为的设置.下面是我个人的设置经验,在这里跟大家分享一下. 个人做了两种设置,都试验成功了,一个简单点,在thinkphp的核心文件中模仿核心行为类添加了另一个行为类,下面是截图: 我的虚拟主机配置文件夹是D:/

SpringMVC的学习____5.乱码问题的解决_两种方法(两个类)

乱码问题很让人心烦,接下来我们来讨论这两种解决乱码问题的方法: 方法1: 使用Spring包中的类 (在web.xml)中注册该过滤器即可) <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/java

【原创】(IOS开发)highlighted和selected两种按钮状态原理摸索分享

先科普以下常识:简单来看,按钮有点击.非点击2个状态,点击时系统会自动调用设置按钮高亮状态的方法(setHighlighted:):非点击时视为正常状态(normal).我们可以根据需要给不同状态设置不同背景图片,苹果官方对按钮状态细致划分为3种:高亮(highlighted).选中(selected).普通(normal),如果编写代码时调用了方法(setSelected:),按钮会呈选中状态(selected). 3种按钮状态,苹果官方命名为: UIControlStateNorma(正常)

逐帧动画 两种实现方式 css和js

第一种: css部分: <style> #foxtail{ background: url(../img/foxtail.png) 0 0 no-repeat; width: 156px; height: 156px; } @keyframes playfox{ 0%{background-position: -6864px 0;} 100%{background-position: 0 0;} } @-webkit-keyframes playfox{ 0%{background-posit

web 开发之js---ajax 中的两种返回状态 xmlhttp.status和 xmlhttp.readyState

(1)xmlhttp.status xmlHttp.status的值(HTTP状态表)0**:未被始化 1**:请求收到,继续处理 2**:操作成功收到,分析.接受 3**:完成此请求必须进一步处理 4**:请求包含一个错误语法或不能完成 5**:服务器执行一个完全有效请求失败 100——客户必须继续发出请求 101——客户要求服务器根据请求转换HTTP协议版本 200——交易成功 201——提示知道新文件的URL 202——接受和处理.但处理未完成 203——返回信息不确定或不完整 204——

Vue路由实现页面跳转的两种方式(router-link和JS)

Vue.js 路由可以通过不同的 URL 访问不同的内容,实现多视图的单页 Web 应用 1.通过 <router-link> 实现 <router-link> 组件用于设置一个导航链接,切换不同 HTML 内容 使用方法: 简单写法 <router-link to="demo2">demo2</router-link> 使用 v-bind 的写法 <router-link :to="'demo2'">de