更少的CSS：獲取javascript或jquery中函數的值

Question

我有這些輸入的形式：

 <input type="text" id="@gray-base" value="#000"> <input type="text" id="@gray-darker" value="lighten(@gray-base, 13.5%)"> 

如何使用@ gray-darker獲取輸入id的顏色值？ 如何在瀏覽器中運行較少的功能？

Answer 1

另請參閱： 如何使用AngularJS動態更新.less文件中的變量

例：

 <form id="colorform"> <input type="text" id="gray-base" value="#000"> <input type="text" id="gray-darker" disabled value=""> <input type="submit"> </form> <script src="//code.jquery.com/jquery-1.11.3.min.js"></script> <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/less.js/2.3.1/less.min.js"></script> <script> $('#colorform').submit(function(e) { less.render('s {color: lighten(' + $('#gray-base').val() + ', 13.5%);}') .then(function(output) { var regExp = /(#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3}))/; var matches = regExp.exec(output.css); var lightcolor = matches[0]; $('#gray-darker').val(lightcolor); $('body').css('background-color',lightcolor); }); e.preventDefault(); }); </script>