我在其中一个在线系统上遇到了一些问题。 我们有一个部分,我们为用户提供URL给他们的客户。这些网址位于几个DIV内,并且有一个包含语言选择的下拉列表,可根据所选语言更新DIV内的网址。问题是,目前这只适用于IE。可能是一些编码错误的javascript,但我无法弄明白。
这是Javascript函数
<script language="JavaScript">
function changedLanguage(langCode, divNames)
{
var i;
for (i in divNames)
document.getElementById(divNames[i]).innerText = document.getElementById(divNames[i]).value.replace('Language_Code=','Language_Code='+langCod e);
}
</script>
function changedTemplate(templateid, divNames)
{
var i;
for (i in divNames)
{
if (templateid == '') {
document.getElementById(divNames[i]).innerText = document.getElementById('f' + divNames[i]).value;
} else {
document.getElementById(divNames[i]).innerText = document.getElementById('f' + divNames[i]).value.replace('template_id=','Role='+templateid+'&Registration=Y').replace('Registration.asp','PersonImport.asp');
};
};
}
这是下拉列表中的代码
<SELECT NAME="lstLanguage" id="lstLanguage">
<OPTION VALUE="">-- Generic default ---</OPTION>
<OPTION ID="Arabic" VALUE="AR">Arabic</OPTION>
<OPTION ID="German" VALUE="D">German</OPTION>
</SELECT>
这是第二次下拉
<select id="lstTemplate" name="lstTemplate">
<option value="">-- Generic default ---</option>
<option value="4">Member</option>
<option value="5">Student</option>
</select>
DIV容器的ID是
'Ind_URL', 'Ind_W_URL', 'LOGIN_URL', 'Login_W_URL', 'GROUP_URL', 'Group_W_URL', 'Group_Login_URL', 'Group_Login_W_URL', 'Holding_Login_URL', 'Holding_Login_W_URL', 'Pre_URL', 'Pre_W_URL'
第一个下拉列表需要更改所有DIV上的参数,第二个下拉列表需要仅更改前两个div上的参数('Ind_URL','Ind_W_URL')。
我尝试使用下面提供的jQuery代码,但只需一次下拉即可完美运行,只要我在第二个下拉列表中更改选择,它就会清除一些div并且不会更改参数。
有什么想法吗?
提前致谢
费德里科
答案 0 :(得分:1)
innerText和outerText仅适用于IE。请使用innerHTML而不是innerText。
答案 1 :(得分:0)
尝试使用jQuery,它会消除许多跨浏览器问题。像这样:
<select name="lstLanguage" id="lstLanguage">
<OPTION VALUE="">-- Generic default ---</OPTION>
<OPTION ID="Arabic" VALUE="AR">Arabic</OPTION>
<OPTION ID="German" VALUE="D">German</OPTION>
</select>
<div id='Ind_URL'>http://example.com/?Language_Code=</div>
<div id='Ind_W_URL'>http://example.com/?Language_Code=</div>
<div id='Login_URL'>http://example.com/?Language_Code=</div>
包含这样的JavaScript:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.js"></script>
<script>
$(function(){
$('#lstLanguage').bind('change', function(){
langCode = $(this).find('option:selected').val();
divIDs = [
'Ind_URL',
'Ind_W_URL',
'Login_URL'
];
for (i in divIDs) {
currentDiv = $('#'+divIDs[i]);
// Cache original div contents, so that the select menu can be changed more than once.
if (typeof currentDiv.data('contents') == 'undefined') {
divContents = currentDiv.text();
currentDiv.data('contents', divContents);
} else {
divContents = currentDiv.data('contents');
}
currentDiv.empty().append(divContents.replace('Language_Code=','Language_Code='+langCode));
}
});
});
</script>
可以在这里玩:http://jsfiddle.net/sDFHg/
那是你想要的那种吗?