Question

我有一个JavaScript函数，可以根据用户的输入更改图像的边框半径和不透明度。这是JavaScript：

tl

这是HTML：

<script>
var input = document.getElementById('opc');
var text = document.getElementById('main');

function changeOpacity(event) {
  if ( event.keyCode === 13 ) {
    var value = input.value;
    var parts = value.split(' ');
    text.style.opacity = '0.' + value;
  }
}
input.addEventListener('keyup', changeOpacity);
</script>
<script>
var input = document.getElementById('modell');
var text = document.getElementById('image');

function changeBorderRadius(event) {
  //works with spacebar 
 if ( event.keyCode === 32 ) {
    var value = input.value;
    var parts = value.split(' ');
    text.style.borderRadius = '5' + value;
  }
}
input.addEventListener('keyup', changeBorderRadius);
</script>

我在这个StackOverflow的帮助下得到了不透明的东西。：d

我尝试添加另一个功能（边框功能）对我来说很好，但是在添加此边框功能后，不透明度的东西停止了工作。

有人能告诉我这里缺少什么或者问题是什么？

Answer 1

您必须稍微修改您的JavaScript。

以下是jsfiddle的工作

<script>
    function changeBorderRadius(e) {
     var key = e.which || e.keyCode || 0;
      //works with space 
     if ( key == 32 ) {
        var value = inputBoarder.value;
        var parts = value.split(' ');    
        textBoarder.style.borderRadius = parts[0] + "px";
      }
    }
    function changeOpacity(e) {
      var key = e.which || e.keyCode || 0;
      if ( key == 32 ) {   
        var value = inputOPC.value;           
        textOPC.style.opacity = '0.' + value;
      }
    }

    var inputOPC = document.getElementById('opc');
    var textOPC = document.getElementById('main');
    inputOPC.addEventListener('keyup', changeOpacity);

    var inputBoarder = document.getElementById('modell');
    var textBoarder = document.getElementById('image');
    inputBoarder.addEventListener('keyup', changeBorderRadius);
</script>

Answer 2

在任一脚本标记中重命名变量。

输入到input1的内容

变量的值被覆盖

需要有关JavaScript功能的帮助

2 个答案: