如何使用警报或表单输入来允许用户设置 CSS 参数的值 [关闭]答案

【问题标题】：How can I use an alert or form input to allow a user to set a value of a CSS parameter [closed]如何使用警报或表单输入来允许用户设置 CSS 参数的值 [关闭]
【发布时间】：2014-05-12 19:00:03
【问题描述】：

基本上，我想要做的是允许用户在按下按钮时的警报中或在按下按钮时使用的表单输入字段中输入值。输入的数字需要在0到360之间。

要更改的 CSS：

.hueshiftFilterEffect{
    -webkit-filter: hue-rotate(0deg); 
}

感谢您的帮助。

【问题讨论】：

你有什么尝试吗？
alert 不是输入法。
我现在只是在玩滤镜效果，我最近对 HTML/CSS 没有做太多的事情所以我没有尝试任何东西，我一直在使用 jquery其他效果。
你还没有问过问题。
@DannyBarber 不幸的是，这个网站不适合那些还没有尝试过任何东西的人。

标签： javascript jquery html css

【解决方案1】：

JSFiddle

使用prompt函数并通过element.css()分配其返回值

$('#btn').click(function(e){
    var w=prompt("Enter new hue:","");
    $('#box').css('-webkit-filter','hue-rotate('+w+'deg)');
});

【讨论】：

【解决方案2】：

尝试通过 javascript 来改变它的样式，或者更好的方法是 JQuery。您可以创建一个表单并使用 JQuery 方法覆盖其提交按钮，然后从表单的输入中获取一个值，然后将其设置为标签的样式参数。这够了吗？

【讨论】：

【解决方案3】：

这应该会让你在其中有所作为......你会想要对其进行一些工作并添加一些验证以检查你是否超出了你的学位范围。

http://jsfiddle.net/2mDgW/

$('.deg').keyup(function() {
  var str = $(this).val();
  $('.tst').css("-webkit-filter", "hue-rotate("+str+"deg)");
});

【讨论】：

【解决方案4】：

提示应该有效示例

<button onclick="myAwesomeFunction()">
 Submit CSS
</button>
<script>
function myAwesomeFunction() {
promptVal = prompt("You wanna change the CSS?", "CSS Here");
getElementByClassName("hueshiftFilterEffect").style.whateveryouwanttochangeinstyle = promptVal;
}
</script>

有什么问题吗？ :D

【讨论】：