0
私は電卓をプログラミングして、同じ列のすべてのボタンが同じ幅を持つようにしようとしています。そのためには、jQueryを使用しています（私は数日で試験があり、私は練習したいので、このようにしています）。すべてのボタンは同じ幅を持っています - jQuery
私のHTMLコード：
<html>
<head>
<meta charset="UTF-8">
<title>CORE2017 P3</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="calculadora.js"></script>
<link href="calculadora.css" rel="stylesheet" type="text/css" media="all">
</head>
<body onload="igualarBotones()">
<header>
<p>Calculator</p>
</header>
<section id="main">
<p>
Número: <input type="text" id="pantalla"> <button id="Limpiar">Limpiar</button>
</p>
<p>
<button id="suma" class="columna1">+</button>
<button id="resta" class="columna2">-</button>
<button id="cuadrado" class="columna3">x<sup>2</sup></button>
</p>
<p>
<button id="inverso" class="columna1">1/x</button>
<button id="raiz" class="columna2">sqrt(x)</button>
<button id="pentera" class="columna3">parte_entera(x)</button>
</p>
<p>
<button id="potencia2" class="columna1">2<sup>x</sup></button>
<button id="factorial" class="columna2">x!</button>
<button id="igual" class="columna3">=</button>
</p>
</section>
</body>
</html>
私のJavaScriptコード：
$(function() {
function igualarBotones(){
var columna1 = $(".columna1");
setMax(columna1);
var columna2 = $(".columna2");
setMax(columna2);
var columna3 = $(".columna3");
setMax(columna3);
}
function setMax(columna){
var maxColumna = -1;
for(i=0; i<columna.length; i++){
if(columna[i].css("width") > maxColumna){
maxColumna = columna[i].css("width");
}
}
for(i=0; i<columna.length; i++){
columna[i].css("width",maxColumna);
}
}
});
それが働いてイマイチなぜ誰もが知っていますか？
編集：私は$(columna[i]).css代わりのcolumna[i].cssを使用し、それが働きました。しかし、私は身体をロードするときに私の関数igualarBotones()が定義されることを達成していません。私はJavascriptをこのよう記述する場合：
$(function() {
var columna1 = $(".columna1");
setMax(columna1);
var columna2 = $(".columna2");
setMax(columna2);
var columna3 = $(".columna3");
setMax(columna3);
function setMax(columna){
var maxColumna = -1;
for(i=0; i<columna.length; i++){
if(parseFloat($(columna[i]).css("width")) > parseFloat(maxColumna)){
maxColumna = $(columna[i]).css("width");
}
}
columna.css("width",maxColumna);
}
});
をそれが動作しますが、私は体にロードされる機能igualarBotones()でそれをやってみたいです。どのようなアイデアを私は間違って何ですか？
ありがとう、ルイス。
使用CSSのフレキシボックス...私が知っているこの – charlietfl
を行うには、スクリプトは必要ありませんが、私は練習のjQueryをしたいと、これは方法だった：
は次のようになります私はjQueryをテストできました。 css（）メソッド。私はポストに示したようにそれを行うことができますか？ – Luiscri
私はこのためにCSSを使用することをお勧めします。あなたのコードの問題は、非jqueryの方法をループしていることです。 'columna [i]の代わりに' $（columna [i]） ' ' - jqueryルートに行くなら、' .each'関数を使うことを強く勧めます。 –