如何將輸入值傳遞給功能參數？

Question

我想將輸入字段值傳遞給函數參數，反轉字符串並將其打印出來。

我已經弄清楚了如何打印輸入字段文本，但是我不知道如何通過函數傳遞它。

<form>
  <p>Input your text here:</p>
  <input type="text" id="inputFieldValue" />
  <input type="button" id="buttonClick" value="Click me!">
</form>

<span id="resultHere"></span>

/ *這是可行的，但它只打印輸入字段文本* /

$('#buttonClick').click(function() { 
    print = $('#inputFieldValue').val();
    $('#resultHere').text(print);
}); 

/ *我不知道如何進行這項工作：* /

someText = $('#inputFieldValue').val();

$('#buttonClick').click(function reverseMe(print) {
    var printMe = print.split('').reverse().join('');
    $('#resultHere').text(printMe);
});
reverseMe(someText);

我只希望它反轉字符串並打印為HTML。

輸入示例：“您好，世界！” 輸出：'！dlroW，olleH'

我想為此使用JS或Jquery。

Answer 1

嘗試在事件處理程序外部定義函數reverseMe ，然后在處理程序的函數內部聲明變量someText 。

應該這樣做：

$('#buttonClick').click(function() {
  someText = $('#inputFieldValue').val();
  reverseMe(someText);
});

function reverseMe(print) {
    var printMe = print.split('').reverse().join('');
    $('#resultHere').text(printMe);
}

Answer 2

我建議首先創建一個將string反向並返回的函數，這將是他唯一的目的。 然后在顯示text之前在click事件處理程序中使用它，如下所示：

 $('#buttonClick').click(function() { let print = $('#inputFieldValue').val(); $('#resultHere').text(reverseStr(print)); }); const reverseStr = (inputStr) => inputStr.split("").reverse().join(""); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <form> <p>Input your text here:</p> <input type="text" id="inputFieldValue" /> <input type="button" id="buttonClick" value="Click me!"> </form> <span id="resultHere"></span> 

為什么不在reverseStr方法內部包括在span元素中也顯示文本的邏輯？ 因為您將失去該方法的可重用性。

另請注意， 不完全支持 功能箭頭表達式 。 因此，您可以考慮使用標准函數聲明。

function reverseStr(inputStr)
{
    return inputStr.split("").reverse().join("");
}

Answer 3

從事件偵聽器中提取方法，然后從偵聽器中調用該方法，並傳入值以進行反轉。

function reverseMe(print) {
    var printMe = print.split('').reverse().join('');
    $('#resultHere').text(printMe);
}

someText = $('#inputFieldValue').val();

$('#buttonClick').click(function(){
    reverseMe($('#inputFieldValue').val());
});

reverseMe(someText);