Question

我正在尝试选择所有带有“name”类的元素，当我点击一个单选按钮时，它会翻转最后一个名字，所以：Hanks，Tom ||汤姆，汉克斯。以下是我到目前为止的情况：

HTML：

<h1>Address Book</h1>

<p>Show Names as:</p>
<input name="lastfirst" value="last" type="radio">First, Last
<input name="firstfirst" value="first" type="radio">Last, First
<div>
    <table <thead="">
        <tbody>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Email</th>
            </tr>
        </tbody>
        <tbody>
            <tr>
                <td>9001</td>
                <td class="name">Tom Hanks,</td>
                <td>tomhanks@moviestars.com</td>
            </tr>
            <tr>
                <td>9002</td>
                <td class="name">Bruce Willis,</td>
                <td>brucewillis@moviestars.com</td>
            </tr>
            <tr>
                <td>9003</td>
                <td class="name">Jim Carrey,</td>
                <td>jimcarrey@moviestars.com</td>
            </tr>
            <tr>
                <td>9004</td>
                <td class="name">Tom Cruise,</td>
                <td>tomcruise@moviestars.com</td>
            </tr>
            <script>

            </script>
        </tbody>
    </table>
</div>
<meta charset="utf-8">
<title>Test</title>
<link rel="stylesheet" href="./webassets/style.css" media="screen" type="text/css">
    <h1>Company Staff List</h1>

<div>
    <table>
        <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>9001</td>
                <td>Tom Hanks,</td>
            </tr>
            <tr>
                <td>9002</td>
                <td>Bruce Willis,</td>
            </tr>
            <tr>
                <td>9003</td>
                <td>Jim Carrey,</td>
            </tr>
            <tr>
                <td>9004</td>
                <td>Tom Cruise,</td>
            </tr>
        </tbody>
    </table>
</div>

这是我的jquery。我使用了.hide（）的填充因为除了选择元素之外，我不知道如何做到这一点。只是一些提示会有所帮助。我不知道如何分隔名字和姓氏。如果我能弄清楚如何简单地将名字和姓氏换成变量，我绝对可以弄明白其余的。

$(document).ready(function(){
  $("input[name='lastfirst']").click(function(){
    $(".name").hide();
  });

  $("input[name='firstfirst']").click(function(){
    $(".name").hide();
  });
});

Answer 1

DEMO

$(document).ready(function () {
    $("input[name='change_last_first']:nth(0)").prop('checked', true)
    $("input[name='change_last_first']").change(function () {
        $(".name").text(function (_, old_txt) {
            var new_txt = old_txt.split(' ').reverse();
            return new_txt.toString().replace(',,', ' ') + ',';
        });
    });
});

HTML已更改

<input name="change_last_first" value="last" type="radio">First, Last
<input name="change_last_first" value="first" type="radio">Last, First

参考

Answer 2

首先使用分割它。 var splStr = input.split(/[ ,]+/);

现在使用input=splStr[1]+splStr[0];

进行连接

Answer 3

您可以使用拆分函数input.split(/[ ,]+/);和正则表达式分隔文本，以分隔输入中的每个“单词”。然后，您可以将每个值分配给新变量

例如：

var a = array[0], b = array[1]

从那里你可以将数组值连接成你选择的任何顺序。

如何使用javascript和jquery在元素中排列文本

3 个答案: