我想就我的博客提出一些帮助。如何连接labels
的两个下拉列表框。为了进一步解释我想要做的是,我在标签的第一个下拉列表框中选择了一个类别,例如我选择" love"它将显示所有具有爱情标签的帖子,当我从label
国家/地区的第二个下拉列表框中选择一个类别时,例如加拿大,它将显示带有加拿大标签的所有爱情标签它。当我从第二个下拉列表框中选择标签时会发生什么情况,它会从头开始重置第一个下拉菜单,这意味着它会显示其中包含加拿大标签的帖子,而不考虑我从第一个下拉列表中选择的第一个标签框。
我已经找到了这个...... Working example
我如何在博客上做同样的事情?
<b:section class='sectopbar' id='sectopbar' showaddelement='yes'>
<b:widget id='Label1' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2 />
</b:if>
<div class='widget- content'>
<br />
<select onchange='location=this.options[this.selectedIndex].value;'>
<option>Select a Category</option>
<b:loop values='data:labels' var='label'>
<option expr:value='data:label.url'>
<data:label.name /> (<data:label.count />)
</option>
</b:loop>
</select>
<b:include name='quickedit' />
</div>
</b:includable>
</b:widget>
</b:section>
<div>
<b:section class='sectopbar2' id='sectopbar2' showaddelement='yes'>
<b:widget id='Label2' locked='false' title='Labels' type='Label'>
<b:includable id='main'>
<b:if cond='data:title'>
<h2 />
</b:if>
<div class='widget- content'>
<br />
<select onchange='location=this.options[this.selectedIndex].value;'>
<option>Select a Country</option>
<b:loop values='data:labels' var='label'>
<option expr:value='data:label.url'>
<data:label.name /> (<data:label.count />)
</option>
</b:loop>
</select>
<b:include name='quickedit' />
</div>
</b:includable>
</b:widget>
</b:section
答案 0 :(得分:0)
刚解决
在博客中添加新小部件并粘贴此脚本
<!DOCTYPE html>
<html>
<body>
<div class="tabs-outer">
<div class="tabs-cap-top cap-top">
<div class="cap-left"></div>
<div class="cap-right"></div>
</div>
<div class="fauxborder-left tabs-fauxborder-left">
<div class="fauxborder-right tabs-fauxborder-right"></div>
<div class="region-inner tabs-inner">
<div class="tabs section" id="crosscol">
<div class="widget HTML" id="HTML3">
<h2 class="title">Multi Label Search</h2>
<div class="widget-content">
<div id="multi-search">
<select id="cmbColumn" name="cmbColumn">
<option value="">Columns</option>
<option value="1%20Column+">1 Column</option>
<option value="2%20Column+">2 Column</option>
<option value="3%20Column+">3 Column</option>
<option value="4%20Column+">4 Column</option>
</select>
<select id="cmbSidebar" name="cmbSidebar">
<option value="">Sidebars</option>
<option value="1%20Left%20Sidebar+">1 Left Sidebar</option>
<option value="2%20Left%20Sidebar+">2 Left Sidebar</option>
<option value="1%20Right%20Sidebar+">1 Right Sidebar</option>
<option value="2%20Right%20Sidebar+">2 Right Sidebar</option>
<option value="Left%20and%20Right+">Left and Right</option>
</select>
<select id="cmbColor" name="cmbColor">
<option value="">Colors</option>
<option value="Black+">Black</option>
<option value="Blue+">Blue</option>
<option value="Brown+">Brown</option>
<option value="Green+">Green</option>
<option value="Gray+">Gray</option>
<option value="Orange+">Orange</option>
<option value="Pink+">Pink</option>
<option value="Red+">Red</option>
<option value="Violet+">Violet</option>
<option value="White+">White</option>
<option value="Yellow+">Yellow</option>
</select>
<select id="cmbFeatures" name="cmbFeatures">
<option value="">Features</option>
<option value="Ads%20Ready">Ads Ready</option>
<option value="Bookmark%20Ready">Bookmark Ready</option>
<option value="Custom%20Navbar">Custom Navbar</option>
<option value="Page%20Number">Page Number</option>
<option value="Slideshow">Slideshow</option>
</select>
<input onclick=" getValue() " value="Filter" type="button">
</div>
</div>
<div class="clear"></div>
<span class="widget-item-control">
<span class="item-control blog-admin">
<a class="quickedit" href="//www.blogger.com/rearrange?blogID=4472703516037708465&widgetType=HTML&widgetId=HTML3&action=editWidget&sectionId=crosscol" onclick=" return _WidgetManager._PopupConfig(document.getElementById("HTML3")); " target="configHTML3" title="Edit">
<img alt="" src="http://img1.blogblog.com/img/icon18_wrench_allbkg.png" height="18" width="18">
</a>
</span>
</span>
<div class="clear"></div>
</div>
</div>
<div class="tabs section" id="crosscol-overflow"></div>
</div>
</div>
<div class="tabs-cap-bottom cap-bottom">
<div class="cap-left"></div>
<div class="cap-right"></div>
</div>
</div>
<script type="text/javascript">
function getValue() {
var valcmbColumn = document.getElementById("cmbColumn").value;
valcmbSidebar = document.getElementById("cmbSidebar").value;
valcmbColor = document.getElementById("cmbColor").value;
valcmbFeatures = document.getElementById("cmbFeatures").value;
valOutput = (valcmbColumn + valcmbSidebar + valcmbColor + valcmbFeatures);
window.open("/search/label/" + valOutput, "_self");
}
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == "block") {
e.style.display = "none";
} else {
e.style.display = "block";
}
}
</script>
</body>
</html>