按钮clic上的Css代码对齐更改 [英] Css code alignment changes on button clic
本文介绍了按钮clic上的Css代码对齐更改的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
使用css编写html的代码，单选按钮应该直接对齐但不要
Code that writes html with css, the radio buttons should align straight but do not
public class ScanForWordsHtml {
private static final Scanner INPUT = new Scanner(System.in);
private static final String FILENAME = "F:/Android.html";
public static void main(String[] args) throws FileNotFoundException {
try (PrintStream output = new PrintStream(FILENAME)) {
output.print("<html>");
output.print("<head>");
output.print("<Style type = text/css>");
output.print(".right_aligned label {");
output.print("float: left;");
output.print("clear: left;");
output.print("padding-right: 1em;");
output.print("text-align: right;");
output.print("}");
output.print("table.center {");
output.print("margin-left:auto; ");
output.print("margin-right:auto;");
output.print("}");
output.print("#words");
output.print("{");
output.print("text-align: center;");
output.print("}");
output.print("#cs");
output.print("{");
output.print("display:inline-block;");
output.print("text-align:left;");
output.print("}");
output.print("</Style>");
output.print("<script src='https://code.jquery.com/jquery-1.12.4.min.js'>");
output.print("</script>");
output.print("<script type='text/javascript'>");
output.print("$(document).ready(function(){");
output.print("$('#btnGetValue').click(function() {");
output.print("var selValue = $('input[name=rbnNumber]:checked').val();");
output.print("$('p').html('<br/>You Selected : ' + selValue + '');");
output.print("});");
output.print("});");
output.print("</script>");
output.print("<script>");
output.print("function buttonClickHandler()");
output.print("{");
output.print("}");
output.print("</script>");
output.print("</head>");
output.print("<body>");
output.print("<table class = 'center'>");
output.print("<TR>");
output.print("<TD>");
String Frenchword = readLine("Frenchword");
output.print(Frenchword);
output.print("</TD>");
output.print("</TR>");
output.print("<TR>");
output.print("<TD>");
readFromUser(output);
output.print("</TD>");
output.print("</TR>");
output.print("<TD>");
output.print("<input type='button' id='btnGetValue' Value='Get Value'>");
output.print("<p>and the results are </p>");
output.print("</TD>");
output.print("<TR>");
output.print("</TR>");
output.print("</table>");
output.print("<Title>");
output.print("String Frenchword = readLine('Frenchword')");
output.print("</Title>");
output.print("</body>");
output.print("</html>");
output.println('\n');
}
}
public static void readFromUser(PrintStream output) {
String wordA = readLine("Word (a)");
String wordB = readLine("Word (b)");
String wordC = readLine("Word (c)");
String wordD = readLine("Word (d)");
String answer = readLine("Correct letter");
//output.println(radio("a", Frenchword, answer));
output.println(radio("a", wordA, answer));
output.println(radio("b", wordB, answer));
output.println(radio("c", wordC, answer));
output.println(radio("d", wordD, answer));
}
private static String readLine(String prompt)
{
System.out.print(prompt + ": ");
return INPUT.nextLine();
}
private static String radio(String letter, String word, String answer)
{
String option = "(" + letter + ") " + word;
String is = letter.equals(answer) ? "is" : "is not";
return "<div id = 'words'><div id = 'cs'><input type='radio' align ='center' name='rbnNumber' value='You selected"
+ option + "which" + is + "the correct answer'/>"
+ option + "<br/></div></div>";
}
}
应该直接写四个单选按钮
我尝试了什么：
java，javascript，css java docs和更改的代码
should write four radio buttons straight aligned
What I have tried:
java, javascript, css java docs and changed code
推荐答案
（document）.ready（function（）{）;
output.print（
(document).ready(function(){"); output.print("
（'＃btnGetValue'） .click（function（）{）;
output.print（var selValue =
('#btnGetValue').click(function() {"); output.print("var selValue =
（'input [name = rbnNumber]：checked'）。val（）; ）;
output.print（
('input[name=rbnNumber]:checked').val();"); output.print("
这篇关于按钮clic上的Css代码对齐更改的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
