Home > Article > Web Front-end > A simple and compact multi-level linkage menu implemented using prototype
A simple and compact multi-level linkage menu implemented using prototype
- PHP中文网Original
- 2016-05-16 19:16:12892browse
Use the js library prototype.js, which can be found by searching on the Internet. It is an open source js function library.
I saw a few posts about linkage menus today
Everyone should have their own better code for this
I also posted a relatively compact code used by our team
// author: downpour
var DoubleCombo = Class.create();
DoubleCombo.prototype = {
initialize: function(source, target, ignore, url, options, excute) {
this .source = $(source);
this.target = $(target);
this.ignore = $A(ignore);
this.url = url;
this.options = $ H(options);
this.source.onchange = this.doChange.bindAsEventListener(this);
if(excute) {
this.doChange();
} ,
},
doChange: function() {
if(this.source.value != '') {
// first clear the ignore ones
this.ignore.each(
function (value) { );
// create parameter for ajax
var query = $H({ id: this.source.value });
var parameters = {
method: 'post',
para meters: $H(this.options) .merge(query).toQueryString(), s );
}
},
getResponse: function(request) {
this.target.options.length = 1;
this.target.options[0].selected = 'selected';
var response = $A(request.responseText.trim().split(';'));
response.length--;
for(var i = 0; i < response.length; i ) {
var optionParam = response[i].split(',');
this.target.options[this.target.options.length] = new Option(optionParam[1], optionParam[0]);
} Provinces and cities. For example, there are no provinces in Shanghai. You can ignore the third-level menu
url action url
options action parameters
excute whether to link
Take a more common example of national, provincial, and municipal level 3 linkage as an example
Code
... ;/html-el:select>