元素属性效果的行为类似于移动而不是副本 [英] element attribute affectation behaves like a move instead of a copy

查看:52
本文介绍了元素属性效果的行为类似于移动而不是副本的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述




假设右和左是多个选择元素。这是关于以下行的




right.options [i] = left.options [j];


它将left.options [j]的内容复制到right.options [i],但

*删除*第一个的内容!


谷歌很难用相关的关键词。你知道吗?这是一个正常的Javascript行为吗?


在Firefox 1.5.x / Windows上测试过。


问候,


-

Mounir。

解决方案



Mounir写道:





假设正确左边是多个选择元素。这是关于以下行的




right.options [i] = left.options [j];


它将left.options [j]的内容复制到right.options [i],但

*删除*第一个的内容!


谷歌很难用相关的关键词。你知道这是Javascript的正常行为吗?



不是JavaScript的问题,而是由javascript操纵的特定DOM

。我看到你在
Firefox中描述的行为,但在IE6中它只是从正确的列表中删除。


在Firefox 1.5.x上测试/ Windows。


问候,


-

Mounir。



您实际上要做的是什么?


right.options [ i] = left.options [j];


首先,我很抱歉没有给我的消息提供HTML样本。


Paul写道:


这不是JavaScript的问题,而是由javascript操纵的特定DOM

。我看到你在
Firefox中描述的行为,但在IE6中,它只是从右侧列表中删除。



什么?你的意思是它甚至没有进行矫揉造作?


你实际上要做的是什么?



你知道,两个多选列表,包括添加,全部添加,

删除, ;全部删除按钮,分别从第一个列表中添加
到第二个,从第一个列表添加到第二个列表,删除

一个并以相同的方式删除所有。


Firefox的行为允许我不创建选项实例

(javascript命令新的Option()),所以我想知道它是否确实是一个

正常行为,而不是我的源代码中的一些错误。而目标

浏览器是Firefox,那很酷:-)


谢谢你,问候,


-

Mounir




Mounir写道:


right.options [i] = left.options [j];



首先,我很抱歉没有给我的消息提供HTML样本。


Paul写道:


不是JavaScript的问题,而是由javascript操纵的特定DOM

。我看到你在
Firefox中描述的行为,但在IE6中,它只是从右侧列表中删除。



什么?你的意思是它甚至没有进行矫揉造作?


你实际上要做的是什么?



你知道,两个多选列表,包括添加,全部添加,

"删除"," ;全部删除按钮,分别从第一个列表中添加
到第二个,从第一个列表添加到第二个列表,删除

一个并以相同的方式删除所有。


Firefox的行为允许我不创建选项实例

(javascript命令新的Option()),所以我想知道它是否确实是一个

正常行为,而不是我的源代码中的一些错误。而目标

浏览器是Firefox,那很酷:-)


谢谢你,问候,


-

Mounir



啊,这是我可以使用的东西:-)

看看这是否适合你。


<?xml version =" 1.0"编码= QUOT; UTF-8英寸?>

<!DOCTYPE html

PUBLIC" - // W3C // DTD XHTML 1.0 Strict // EN"

" ; http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

< html xmlns =" http://www.w3.org/ 1999 / xhtml">

< head>

< title>选择测试< / title>


< style type =" text / css">

#selSwap fieldset {

width:30em;

height:10em;

}

#selSwap fieldset div {

display:block;

宽度:30%;

float:left;

}

#selSwap fieldset div输入,选择{

margin-left:1em;

宽度:90%;

font-family:monospace;

}


#selSwap fieldset div input {

身高:1.5em;

margin-top:0.5em;

}

#selSwap fieldset div select {

身高:10em;

}

< / style>

< script type =" text / JAVA脚本">

函数副本(selSrc,selDest){

var opts = selSrc.options;

for(var i = opts。长度-1; I> = 0; i - ){

if(opts [i] .selected){

selDest.appendChild(opts [i]);

}

}

}


函数copyAll(selSrc,selDest){

var opts = selSrc .options;

for(var i = opts.length-1; i> = 0; i - ){

selDest.appendChild(opts [i]);

}

}

< / script>


< / head>


< body>


< form action ="#" id =" selSwap">

< fieldset>

< legend>交换多选乐趣< / legend>

< div> ;

< select multiple =" multiple名称= QUOT;左" id =" left">

< option value =" 1"> Apple< / option>

< option value =" 2"> ; Orange< / option>

< option value =" 3"> Banana< / option>

< option value =" 4"> Grape< ; / option>

< / select>

< / div>

< div>

< input type =" button" value =" Add"

onclick =" copy(this.form.left,this.form.right)" />

< input type =" button" value =" Add All"

onclick =" copyAll(this.form.left,this.form.right)" />

< input type =" button" value ="删除"

onclick =" copy(this.form.right,this.form.left)" />

< input type =" button" value ="全部删除

onclick =" copyAll(this.form.right,this.form.left)" />

< / div>

< div>

< select multiple =" multiple"名称= QUOT;右" id =" right">

< option value =" a"> red< / option>

< option value =" b"> ; orange< / option>

< option value =" c"> yellow< / option>

< option value =" d"> purple< ; / option>

< / select>

< / div>

< / fieldset>

< / form>


< / body>


< / html>


Hi,

Assume that right and left are multiple select elements. It''s about the
following line :

right.options[i]=left.options[j];

It copies the content of left.options[j] into right.options[i], but
*removes* the content of the first one !

It''s hard to google with relevant keywords. Do you know if it''s a
normal behaviour of Javascript ?

Tested on Firefox 1.5.x/Windows.

Regards,

--
Mounir.

解决方案


Mounir wrote:

Hi,

Assume that right and left are multiple select elements. It''s about the
following line :

right.options[i]=left.options[j];

It copies the content of left.options[j] into right.options[i], but
*removes* the content of the first one !

It''s hard to google with relevant keywords. Do you know if it''s a
normal behaviour of Javascript ?

Not really a matter of JavaScript but, of the particular DOM being
manipulated by the javascript. I see the behavior you described in
Firefox but, in IE6 it simply removes from the right list.

Tested on Firefox 1.5.x/Windows.

Regards,

--
Mounir.

What is it that you are actually trying to do ?


right.options[i]=left.options[j];

First, I apologize not have given an HTML sample with my message.

Paul wrote :

Not really a matter of JavaScript but, of the particular DOM being
manipulated by the javascript. I see the behavior you described in
Firefox but, in IE6 it simply removes from the right list.

What ? You mean it doesn''t even perform the affectation ?

What is it that you are actually trying to do ?

You know, two multiple selection lists, with "Add", "Add All",
"Remove", "Remove All" buttons, respectively to add from the first list
to the second, to add all from the first list to the second, to remove
one and remove all with same ways.

The behavior of Firefox allows me to not create options instances
(javascript command new Option()), so I wondered if it was indeed a
normal behavior and not some bug in my source code. And as the target
browser is Firefox, that''s cool :-)

Thank you and regards,

--
Mounir



Mounir wrote:

right.options[i]=left.options[j];


First, I apologize not have given an HTML sample with my message.

Paul wrote :

Not really a matter of JavaScript but, of the particular DOM being
manipulated by the javascript. I see the behavior you described in
Firefox but, in IE6 it simply removes from the right list.


What ? You mean it doesn''t even perform the affectation ?

What is it that you are actually trying to do ?


You know, two multiple selection lists, with "Add", "Add All",
"Remove", "Remove All" buttons, respectively to add from the first list
to the second, to add all from the first list to the second, to remove
one and remove all with same ways.

The behavior of Firefox allows me to not create options instances
(javascript command new Option()), so I wondered if it was indeed a
normal behavior and not some bug in my source code. And as the target
browser is Firefox, that''s cool :-)

Thank you and regards,

--
Mounir

Ah, that is something I can work with :-)
See if this will work for you.

<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Select test</title>

<style type="text/css">
#selSwap fieldset{
width: 30em;
height: 10em;
}
#selSwap fieldset div{
display:block;
width: 30%;
float:left;
}
#selSwap fieldset div input, select{
margin-left: 1em;
width: 90%;
font-family: monospace;
}

#selSwap fieldset div input{
height: 1.5em;
margin-top: 0.5em;
}
#selSwap fieldset div select{
height: 10em;
}
</style>
<script type="text/javascript">
function copy(selSrc,selDest){
var opts = selSrc.options;
for(var i=opts.length-1; i>=0; i--){
if(opts[i].selected){
selDest.appendChild(opts[i]);
}
}
}

function copyAll(selSrc,selDest){
var opts = selSrc.options;
for(var i=opts.length-1; i>=0; i--){
selDest.appendChild(opts[i]);
}
}
</script>

</head>

<body>

<form action="#" id="selSwap">
<fieldset>
<legend>Swaping multiselect fun</legend>
<div>
<select multiple="multiple" name="left" id="left">
<option value="1">Apple</option>
<option value="2">Orange</option>
<option value="3">Banana</option>
<option value="4">Grape</option>
</select>
</div>
<div>
<input type="button" value="Add"
onclick="copy(this.form.left,this.form.right)" />
<input type="button" value="Add All"
onclick="copyAll(this.form.left,this.form.right)" />
<input type="button" value="Remove"
onclick="copy(this.form.right,this.form.left)" />
<input type="button" value="Remove All"
onclick="copyAll(this.form.right,this.form.left)" />
</div>
<div>
<select multiple="multiple" name="right" id="right">
<option value="a">red</option>
<option value="b">orange</option>
<option value="c">yellow</option>
<option value="d">purple</option>
</select>
</div>
</fieldset>
</form>

</body>

</html>


这篇关于元素属性效果的行为类似于移动而不是副本的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆