Question

我有一些问题，我不知道为什么。我尝试使用输入文本更改按钮的边框半径，但是当我单击提交按钮时它不起作用。我有这个：

$(document).ready(function(){
	$("#submitBorderRadius").click(function(){
		var x = $("#borderradiusSelect").val(); 
		$("#testButton").css("borderRadius", x)
    });
});

<button id="testButton">Test</button>


<form>
Border Radius : <input type="text" id="borderradiusSelect" value="0px"><br>
<button id="submitBorderRadius">Submit</button>
</form>

有人知道这是什么问题吗？

Answer 1

当＆＃34;提交＆＃34;单击按钮，页面正在重新加载，因此您永远不会有机会看到应用于＆＃34;测试＆＃34;的边界半径值。按钮。

您可以使用jQuery＆＃39; preventDefault()方法停止点击重新加载页面。

我已更新您的代码以显示此操作：

＆＃13;

$(document).ready(function(){
  $("#submitBorderRadius").click(function(e){
    e.preventDefault();
    var x = $("#borderradiusSelect").val();
    $("#testButton").css("borderRadius", x)
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="testButton">Test</button>


<form>
Border Radius : <input type="text" id="borderradiusSelect" value="0px"><br>
<button id="submitBorderRadius">Submit</button>
</form>

＆＃13;

使用输入文本更改按钮的边框半径

1 个答案: