如何通过select选中的项动态改变一个input输入项的值？

Question

<select name="group_id" id="group_id">
       <c:forEach  var="group" items="${groups }">
        <option value="${group.id }">${group.name }</option>
      </c:forEach>
</select><input id="url" type="text" name="url"   size="100" value="http://192.168.1.3/">
<Script>
  document.getElementById('group_id').onchange=function(){
 document.getElementById('url').value="http://192.168.1.3/"+this.value+"/"+this.options[this.selectedIndex].innerText;console.log(this.select);
  }
  </script>

Answer 1

还在线吗 ，代码确实可用，有两点问题，第一：select要手动选中某个条目url才会变，一进页面的时候secect默认选中的那个项对应的url没变化，第二，url后面还需要再追加group对像的area,能再帮我改改吗？多谢多谢！

Answer 2

<select name="group_id" id="group_id">
          <c:forEach  var="group" items="${groups }">
              <option value="${group.id }" area="${group.area}">${group.name }</option>
         </c:forEach>
</select>
 
<input id="url" type="text" name="url"   size="100" value="http://192.168.1.3/">
<Script>
  var group_id=document.getElementById('group_id');
  group_id.onchange=function(){
 document.getElementById('url').value="http://192.168.1.3/"+this.value+"/"+this.options[this.selectedIndex].innerText+"/"+this.options[this.selectedIndex].getAttribute('area');
  }
  group_id.onchange.call(group_id);
  </script>

Answer 3

非常感谢，第一个问题已经解决了，第二个追加group对像的area值this.options[this.selectedIndex].getAttribute('area')取到的是null ,能帮我解决下么？

Answer 4

测试是可以取得到的，你用什么浏览器的，把前台html贴出来看下

Answer 5

测试是可以取得到的，你用什么浏览器的，把前台html贴出来看下是我自己的问题，没看到你加了一个area属性，我照加了之后就搞定了，太感谢你了 帮了我大忙了，