Новый взгляд с использованием Async / Await и callback. Вам нужна только одна строка кода, если вы сохраните метод расширения в своем проекте.
/// <summary>
/// A new way to use Tasks for Asynchronous calls
/// </summary>
public class Example
{
/// <summary>
/// No more delegates, background workers etc. just one line of code as shown below
/// Note it is dependent on the XTask class shown next.
/// </summary>
public async void ExampleMethod()
{
//Still on GUI/Original Thread here
//Do your updates before the next line of code
await XTask.RunAsync(() =>
{
//Running an asynchronous task here
//Cannot update GUI Thread here, but can do lots of work
});
//Can update GUI/Original thread on this line
}
}
/// <summary>
/// A class containing extension methods for the Task class
/// Put this file in folder named Extensions
/// Use prefix of X for the class it Extends
/// </summary>
public static class XTask
{
/// <summary>
/// RunAsync is an extension method that encapsulates the Task.Run using a callback
/// </summary>
/// <param name="Code">The caller is called back on the new Task (on a different thread)</param>
/// <returns></returns>
public async static Task RunAsync(Action Code)
{
await Task.Run(() =>
{
Code();
});
return;
}
}
Вы можете добавить другие вещи к методу расширения, например, обернуть его в оператор Try / Catch, чтобы вызывающий мог сказать ему, какой тип будет возвращен после завершения, обратный вызов исключения для вызывающего:
Добавление Try Catch, Auto Exception Logging и CallBack
/// <summary>
/// Run Async
/// </summary>
/// <typeparam name="T">The type to return</typeparam>
/// <param name="Code">The callback to the code</param>
/// <param name="Error">The handled and logged exception if one occurs</param>
/// <returns>The type expected as a competed task</returns>
public async static Task<T> RunAsync<T>(Func<string,T> Code, Action<Exception> Error)
{
var done = await Task<T>.Run(() =>
{
T result = default(T);
try
{
result = Code("Code Here");
}
catch (Exception ex)
{
Console.WriteLine("Unhandled Exception: " + ex.Message);
Console.WriteLine(ex.StackTrace);
Error(ex);
}
return result;
});
return done;
}
public async void HowToUse()
{
//We now inject the type we want the async routine to return!
var result = await RunAsync<bool>((code) => {
//write code here, all exceptions are logged via the wrapped try catch.
//return what is needed
return someBoolValue;
},
error => {
//exceptions are already handled but are sent back here for further processing
});
if (result)
{
//we can now process the result because the code above awaited for the completion before
//moving to this statement
}
}
Вы должны иметь возможность применять стили непосредственно к переключателям, например:
#choice {
width: 5px;
}
Вы можете выполнить один из следующих двух процессов:
.row {
margin: 50px;
}
/* --- Process One --- */
/* input[type=radio] {
width: 5px;
height: 5px;
vertical-align: middle;
} */
/* --- Process Two --- */
input[type=radio] {
-ms-transform: scale(0.5); /* IE 9 */
-webkit-transform: scale(0.5); /* Chrome, Safari, Opera */
transform: scale(0.5);
}
<div class="row">
<div class="questions">
What is the name of Black Panther's home?
<br>
<input id="choice" type="radio" name="firstQuestion" value="false" >K'un Lun
<input id="choice" type="radio" name="firstQuestion" value="true">Wakanda
<input id="choice" type="radio" name="firstQuestion" value="false" >Kamar Taj
<br>
How did Dr Strange defeat Dormammu?<br>
<input id="choice" type="radio" name="secondQuestion" value="false" >Built An Energy Prison
<input id="choice" type="radio" name="secondQuestion" value="true" >Create a Time Loop
<input id="choice" type="radio" name="secondQuestion" value="false" >Froze Time
<br>
Which hero secretly has a family?<br>
<input id="choice" type="radio" name="thirdQuestion" value="true" >Hawkeye
<input id="choice" type="radio" name="thirdQuestion" value="false" >Wakanda
<input id="choice" type="radio" name="thirdQuestion" value="false" >Kamar Taj
</div>
<div>
<input type="button" value="Submit" onclick="submitted()"/>
</div>
<p id="firstPara"></p>
<p id="secondPara"></p>
</div>
Вот рабочий код: http://jsfiddle.net/ftbaw0ps/1/
Пожалуйста, используйте правильный синтаксис HTML, например:
<div class="row">
<div class="questions">
<div>
<p>What is the name of Black Panther's home?</p>
<input id="choice" type="radio" name="firstQuestion" value="false">K'un Lun
<input id="choice" type="radio" name="firstQuestion" value="true">Wakanda
<input id="choice" type="radio" name="firstQuestion" value="false">Kamar Taj
</div>
<div>
<p>How did Dr Strange defeat Dormammu?</p>
<input id="choice" type="radio" name="secondQuestion" value="false">Built An Energy Prison
<input id="choice" type="radio" name="secondQuestion" value="true">Create a Time Loop
<input id="choice" type="radio" name="secondQuestion" value="false">Froze Time
</div>
<div>
<input type="button" value="Submit" onclick="submitted()"/>
</div>
<p id="firstPara"></p>
<p id="secondPara"></p>
</div>
</div>
С другой стороны, @sjdm ответил на ваш вопрос: когда вы используете правильный селектор для ввода, вы должны всегда применять стиль к нему / им.
#choice{
width: 10px;
}