Question

<style type="text/css" media="screen">
.square {
    width: 144px;
    height: 144px;
    background: #fff;
    margin-right: 48px;
    float: left;
}

.transformed {
    -webkit-transform: rotate(15deg) scale(1.25, 0.5);
    -moz-transform: rotate(15deg) scale(1.25, 0.5);
    transform: rotate(15deg) scale(1.25, 0.5);
}
</style>
<script type="text/javascript">

function change(txt){
    var d = document.getElementById('derg').value;alert(d);
    //alert(txt);
    //alert(d);
    //var a1=5;
    //var a2=5;
    //var a3=a1+a2;
    //alert(a3);

    var dd = d+txt;
    alert(dd);
    document.getElementById('derg').value=dd;
    var a=dd+'deg';
    //alert(a);

    document.getElementById('tdiv4').style.MozTransform = 'rotate('+a+')';
}
</script>



<div id="tdiv4" class="square" >this is tdiv4</div>

<input type="hidden" value="" id="derg">
<input type="button" onclick="change(20)" value="change"/>

旋转是完美的但是问题是它没有将以前的值添加到新值它的连接两个值我不想要连接。再次使用前值20和新值2然后旋转角度应该是40deg。但它显示旋转角度2020即issue.so请帮帮我

Answer 1

JSFiddle

function change(txt){
    var d = document.getElementById('derg').value || 0;

    var dd = parseInt(d)+parseInt(txt);

    document.getElementById('derg').value=dd;
    var a=dd+'deg';


    document.getElementById('tdiv4').style.MozTransform = 'rotate('+a+')';
}

它确实需要parseInt，但它也需要一个初始值，所以在我的例子中，如果它没有值，它将需要0

Answer 2

您需要将d和txt值从字符串转换为数字。 e.g。

var number = parseInt(d);

您可以首先使用isNan测试NaN错误，例如

if (!isNaN(d)) {
   var number = parseInt(d);
}

按钮单击事件代码旋转文本（有问题）

2 个答案: