用于向变量添加更多值的函数

时间:2015-09-25 19:28:17

标签: javascript select

我得到了以下代码,我希望我的i变量可以被select值读取,然后每次我更改select值时都会将新值添加到旧值,但我不知道为什么它不起作用



var tamany = document.getElementById('tam');
var i = document.getElementById('tam').value
var ancho = "300";
var largo = "300px";
var cc = parseInt(ancho) + parseInt(i);

function aa() {
document.getElementById("change").style.width = (cc + '+px+');
document.getElementById("change").style.height = (largo);
})

ul {
  margin-top: -700px;
}
#man {
  z-index: 500;
}
#pantalon {
  position: absolute;
  margin-top: 400px;
  margin-left: -500px;
  z-index: -1;
}
#change {
  position: absolute;
  margin-top: 100px;
  z-index: -2;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img id="man" src="man.png" height="900">
<img id="pantalon" src="http://static.bershka.net/4/photos2/2015/I/0/2/p/5337/506/594/5337506594_1_2_4.jpg?t=ts" height="500">
<img id="change" src="http://static.pullandbear.net/2/photos/2015/I/0/2/p/9592/500/800/9592500800_2_1_1.jpg?timestamp=1437741171705" height="500" width="500">
<button onclick="aa()">Cambiar</button>

<select id="tam" name="tam1">
  <option value="none"></option>
  <option value="100">100</option>
  <option value="200">-100</option>
</select>
&#13;
&#13;
&#13;

3 个答案:

答案 0 :(得分:0)

var staticGeo = new ol.source.GeoJSON(({
    object: {
        type: 'Feature Collection',
        crs: {
           type: 'name',
           properties: {name: 'EPSG:4326'}
        },
        features: [{
           type: 'Feature',
           geometry: {
               type: 'Point',
               coordinates: [0,0]
           }
        }]
     },
     projection: 'EPSG:3857'
   }));

   var vectorSource = new ol.source.Vector({
       source: staticGeo
   });

   var vectorLayer = new ol.layer.Vector({
       source: vectorSource,
       style: new ol.style.Style({
           fill: new ol.style.Fill({
                color: 'rgba(255,255,255,0.2)'
           }),
           stroke: new ol.style.Stroke({
                color: 'blue',
                width: 1
           })
        })
     })

     this.map.addLayer(vectorLayer);

这就是获取所选选项值的方法。要在用户选择选项时更新var i = tamany.options[tamany.selectedIndex].value; 变量,请使用i事件。

答案 1 :(得分:0)

您可以尝试使用onchange()事件,这意味着每次更改下拉列表的值时,都会触发此函数,以便您可以将新值添加到较旧的值。

答案 2 :(得分:0)

几个问题:

其一,您在页面加载时设置icc。您需要在aa()中设置它们,以便从菜单中获取当前选择。

其次,您将'+px+'连接到cc而不是px,这会创建无效的宽度。

第三,在)函数之后,你有一个额外的aa()

var tamany = document.getElementById('tam');
var ancho = "300";
var largo = "300px";

function aa() {
  var i = tamany.value
  var cc = parseInt(ancho) + parseInt(i);
  document.getElementById("change").style.width = (cc + 'px');
  document.getElementById("change").style.height = (largo);
}
ul {
  margin-top: -700px;
}
#man {
  z-index: 500;
}
#pantalon {
  position: absolute;
  margin-top: 400px;
  margin-left: -500px;
  z-index: -1;
}
#change {
  position: absolute;
  margin-top: 100px;
  z-index: -2;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<img id="man" src="man.png" height="900">
<img id="pantalon" src="http://static.bershka.net/4/photos2/2015/I/0/2/p/5337/506/594/5337506594_1_2_4.jpg?t=ts" height="500">
<img id="change" src="http://static.pullandbear.net/2/photos/2015/I/0/2/p/9592/500/800/9592500800_2_1_1.jpg?timestamp=1437741171705" height="500" width="500">
<button onclick="aa()">Cambiar</button>

<select id="tam" name="tam1">
  <option value="none"></option>
  <option value="100">100</option>
  <option value="200">-100</option>
</select>