# 10.1-标签文档
# 10.1 留言表单
<div class="x-message-wrap2">
<form action="{{ url_inquiry }}" id="x-form" method="post">
{{ csrf_field() }}
<input name="action" type="hidden" value="saveadd" />
<div class="row">
<div class="col-md-12 col-sm-12">
<input type="text" name="name" placeholder="姓名">
</div>
<div class="col-md-12 col-sm-12">
<input type="text" name="contact" placeholder="电话">
</div>
<div class="col-xs-12 x-textarea">
<textarea rows="5" name="content" placeholder="留言" ></textarea>
</div>
</div>
<div class="row">
<div class="col-md-12 col-sm-12 code-group">
<input id="uuid2" name="uuid" type="hidden" value="">
<input id="checkcode" class="checkcode" name="checkcode" type="text" placeholder="验证码" />
<img id="codeimg2" src="" onclick="app.getCode2(120, 52, this)" style="cursor: pointer;"/>
</div>
</div>
<div class="row">
<div class="col-md-12 col-sm-12">
<input type="submit" class="x-submit" name="btn" value="立即提交" />
</div>
</div>
</form>
</div>
<!--{ js }-->
<script>
//切换验证码图片
getCode2: function (width, height, e) {
$.get('https://api.myxypt.com/captcha?width=' + width + '&height=' + height, function (res) {
if (res.code == 0) {
$(e).parents("div").find("#codeimg2").attr("src", res.data.Captcha);
$(e).parents("div").find("#uuid2").attr("value", res.data.uuid);
}
})
},
</script>
<script>
$(function () {
app.getCode2(120, 34, '.checkcode')
})
</script>
<!--{ css }-->
<style>
.x-message-wrap2 {margin-left: 0px;margin-right: 0px}
.x-message-wrap2 .row {margin-left: -5px;font-size: 0;margin-right: -5px}
.x-message-wrap2 div[class^='col-'] {padding-left: 5px;padding-right: 5px;position: relative;}
.x-message-wrap2 input[type='text'],.x-message-wrap2 textarea {width: 100%;height: 45px;border: none;padding: 0 15px;font-size: 18px;color: #9fa0a0;background: #edf1f5;outline: none;margin-bottom: 10px;}
.x-message-wrap2 input[type='text']::-webkit-input-placeholder,.x-message-wrap2 textarea::-webkit-input-placeholder {color: #9fa0a0}
.x-message-wrap2 input[type='text']:-ms-input-placeholder,.x-message-wrap2 textarea:-ms-input-placeholder {color: #9fa0a0}
.x-message-wrap2 input[type='text']::-ms-input-placeholder,.x-message-wrap2 textarea::-ms-input-placeholder {color: #9fa0a0}
.x-message-wrap2 input[type='text']::placeholder,.x-message-wrap2 textarea::placeholder {color: #9fa0a0;}
.x-message-wrap2 textarea {padding-top: 15px;height: 80px;resize: none}
.x-message-wrap2 #checkcode {float: left;width: 72.29813665%;margin-bottom: 0;}
.x-message-wrap2 #codeimg2 {float: right;display: block;text-align: center;width: 25.39130435%;height: 45px;font-size: 0;background: #e7e4e4;padding: 0px;}
.x-message-wrap2 .x-submit {margin-top: 15px;width: 100%;height: 45px;background: #ed0c12;color: #fff;font-size: 16px;border: none;outline: none;
-webkit-transition: all .5s ease;transition: all .5s ease;}
.x-message-wrap2 .x-submit:hover {background: #ed0c12}
.x-message-wrap2 .n-default .x-textarea .msg-wrap{top: 10px;}
</style>
# 10.1 分类调取
<ul class="product-cate">
{% for value in app('category').lists('product') %}
<li>
<a href="{{ value.url }}">{{ value.cname }}</a>
{% if value.childcategory is not empty %}
<ul class="xypg-left-subnav">
{% for second in value.childcategory %}
<li data-id="{{ second.cid }}">
<a href="{{ second.url }}">{{ second.cname }}</a>
</li>
{% endfor %}
</ul>
{% endif %}
</li>
{% endfor %}
</ul>
参数说明：
{% for value in app('category').lists('product') %}
{{ value.url }} // 调取链接地址
{{ value.cname }} // 调取分类名称
{{ value.img }} // 调取缩略图
{{ value.banner }} // 调取栏目图片（一般为当前分类banner图）
{{ value.intro }} // 调取缩略图备注
{% endfor %}
# 10.1 友情链接
{% if count is not empty %}
<div class="link hidden-sm hidden-xs">
<dd>
{% for value in app('links').lists(1) %}
<a href='{{ value.linkurl }}' target='_blank'>{{ value.linktitle }}</a>
{% endfor %}
</dd>
</div>
{% endif %}
# 10.1 底部分类
<dl>
<dt>关于我们</dt>
{% for value in app('page').lists(27) %}
<dd><a href="{{ value.url }}">{{ value.title }}</a></dd>
{% endfor %}
</dl>
<dl>
<dt>产品中心</dt>
{% for value in app('category').lists('product') %}
<dd><a href="{{ value.url }}">{{ value.cname }}</a></dd>
{% endfor %}
</dl>
# 10.1 分类tab切换
<div class="c1_index">
<div class="max1500 clearfix">
<div class="ttt1 text-center">
<h3>产品展示</h3>
</div>
<div class="pro-wrap">
<ul class="pro-sort hd">
{% for value in app('category').lists('product') %}
<li><a href="{{ value.url }}">{{ value.cname }}</a></li>
{% endfor %}
</ul>
<div class="pro-content bd">
{% for value in app('category').lists('product') %}
<div class="pro-main">
<ul class="val-list">
{% for val in app('content').lists('product', value.cid, 8) %}
<li>
<a href="{{ val.url }}" title="{{ val.title }}" class="img">
<div class="img com-img"><img src="{{ app('content').thumb(val.uploadfiles[0],600,600) }}" alt="{{ val.title }}"></div>
<h3>{{ val.title | truncate(20,'...')}}</h3>
</a>
</li>
{% endfor %}
</ul>
</div>
{% endfor %}
</div>
</div>
</div>
</div>
<script>
jQuery(".pro-wrap").slide({});
</script>
# 10.1 单页三级下拉
<ul class="page-cate">
{% for cate in second.chil_cate %}
<li><a href="{{ cate.url }}">{{ cate.title }}</a><li>
{% endfor %}
</ul>
# 10.1 分类三级下拉
<div class="sec">
<a href="{{ second.url }}" {% if second.target=='_blank' %}target='_blank' {% endif %}>{{ second.title }}</a>
<div class="third">
{% for cate in second.chil_cate %}
<a href="{{ cate.url }}">{{ cate.title }}</a>
{% endfor %}
</div>
</div>
# 10.1 限制数量
{% if loop.index0 < 3 %}
{% endif %}
# 常用代码
<!-- master密码初始化：-->
cb0e5888bc95167352296dee874f22ab
热门关键词：{{ h1 | raw }}
限制字符 {{ value.summary|truncate(60,'...') }}
← 9.8.5-标签文档 10.1-可视化标签 →