Question

您好我设计了一个包含一些输入的折叠，但是显示崩溃下的文本没有适当的空格和行结尾，请帮忙。我希望我的代码显示就像我在崩溃中粘贴的方式（html代码）。我用jquery。如果有人可以指导我如何输入要折叠的文本文件而不是粘贴所有输入，也非常感谢。

<div class="container">
  <h2>Accordion Example</h2>
  <p><strong>Note:</strong> The <strong>data-parent</strong> attribute makes sure that all collapsible elements under the specified parent will be closed when one of the collapsible item is shown.</p>
  <div class="panel-group" id="accordion">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse1">FETCH LOCAL ADMINS OF SERVERS IN YOUR AD DOMAIN</a>
        </h4>
      </div>
      <div id="collapse1" class="panel-collapse collapse in">
        <div class="panel-body">
<p>Import-Module activedirectory
Clear-Host
function Get-LocalAdminToCsv {
    Param(
            $Path          = (Get-ADDomain).DistinguishedName,   
            $ComputerName  = (Get-ADComputer -Filter * -Server (Get-ADDomain).DNsroot -SearchBase $Path -Properties Enabled | Where-Object {$_.Enabled -eq "True"})
         )

    begin{
        [array]$Table = $null
        $Counter = 0
         }

    process
    {
    $Date       = Get-Date -Format MM_dd_yyyy_HH_mm_ss
    $FolderName = "LocalAdminsReport("+ $Date + ")"
    New-Item -Path ".\$FolderName" -ItemType Directory -Force | Out-Null

        foreach($Computer in $ComputerName)
        {
            try
            {
                $PC      = Get-ADComputer $Computer
                $Name    = $PC.Name
                $CountPC = @($ComputerName).count
            }

            catch
            {
                Write-Host "Cannot retrieve computer $Computer" -ForegroundColor Yellow -BackgroundColor Red
                Add-Content -Path ".\$FolderName\ErrorLog.txt" "$Name"
                continue
            }

            finally
            {
                $Counter ++
            }

            Write-Progress -Activity "Connecting PC $Counter/$CountPC " -Status "Querying ($Name)" -PercentComplete (($Counter/$CountPC) * 100)

            try
            {
                $row = $null
                $members =[ADSI]"WinNT://$Name/Administrators"
                $members = @($members.psbase.Invoke("Members"))
                $members | foreach {
                            $User = $_.GetType().InvokeMember("Name", 'GetProperty', $null, $_, $null)
                                    $row += $User
                                    $row += " ; "
                                    }
                write-host "Computer ($Name) has been queried and exported." -ForegroundColor Green -BackgroundColor black 

                $obj = New-Object -TypeName PSObject -Property @{
                                "Name"           = $Name
                                "LocalAdmins"    = $Row
                                                    }
                $Table += $obj
            }

            catch
            {
            Write-Host "Error accessing ($Name)" -ForegroundColor Yellow -BackgroundColor Red
            Add-Content -Path ".\$FolderName\ErrorLog.txt" "$Name"
            }


        }
        try
        {
            $Table  | Sort Name | Select Name,LocalAdmins | Export-Csv -path ".\$FolderName\Report.csv" -Append -NoTypeInformation
        }
        catch
        {
            Write-Warning $_
        }
    }

    end{}
   }</p>
    </div>
      </div>
    </div>
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse2">Collapsible Group 2</a>
        </h4>
      </div>
      <div id="collapse2" class="panel-collapse collapse">
        <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit,
        sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
      </div>
    </div>
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse3">Collapsible Group 3</a>
        </h4>
      </div>
      <div id="collapse3" class="panel-collapse collapse">
        <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit,
        sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
      </div>
    </div>
  </div> 
</div>

我附加了输出。

Answer 1

如@charlietfl所述，您需要使用<pre>标记。

pre标签定义了预先格式化的文本。

pre元素中的文本以固定宽度字体（通常为Courier）显示，并保留空格和换行符。

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>


<div class="container">
  <h2>Accordion Example</h2>
  <p><strong>Note:</strong> The <strong>data-parent</strong> attribute makes sure that all collapsible elements under the specified parent will be closed when one of the collapsible item is shown.</p>
  <div class="panel-group" id="accordion">
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse1">FETCH LOCAL ADMINS OF SERVERS IN YOUR AD DOMAIN</a>
        </h4>
      </div>
      <div id="collapse1" class="panel-collapse collapse in">
        <div class="panel-body">

<pre>
Import-Module activedirectory
Clear-Host
function Get-LocalAdminToCsv {
    Param(
            $Path          = (Get-ADDomain).DistinguishedName,   
            $ComputerName  = (Get-ADComputer -Filter * -Server (Get-ADDomain).DNsroot -SearchBase $Path -Properties Enabled | Where-Object {$_.Enabled -eq "True"})
         )

    begin{
        [array]$Table = $null
        $Counter = 0
         }

    process
    {
    $Date       = Get-Date -Format MM_dd_yyyy_HH_mm_ss
    $FolderName = "LocalAdminsReport("+ $Date + ")"
    New-Item -Path ".\$FolderName" -ItemType Directory -Force | Out-Null

        foreach($Computer in $ComputerName)
        {
            try
            {
                $PC      = Get-ADComputer $Computer
                $Name    = $PC.Name
                $CountPC = @($ComputerName).count
            }

            catch
            {
                Write-Host "Cannot retrieve computer $Computer" -ForegroundColor Yellow -BackgroundColor Red
                Add-Content -Path ".\$FolderName\ErrorLog.txt" "$Name"
                continue
            }

            finally
            {
                $Counter ++
            }

            Write-Progress -Activity "Connecting PC $Counter/$CountPC " -Status "Querying ($Name)" -PercentComplete (($Counter/$CountPC) * 100)

            try
            {
                $row = $null
                $members =[ADSI]"WinNT://$Name/Administrators"
                $members = @($members.psbase.Invoke("Members"))
                $members | foreach {
                            $User = $_.GetType().InvokeMember("Name", 'GetProperty', $null, $_, $null)
                                    $row += $User
                                    $row += " ; "
                                    }
                write-host "Computer ($Name) has been queried and exported." -ForegroundColor Green -BackgroundColor black 

                $obj = New-Object -TypeName PSObject -Property @{
                                "Name"           = $Name
                                "LocalAdmins"    = $Row
                                                    }
                $Table += $obj
            }

            catch
            {
            Write-Host "Error accessing ($Name)" -ForegroundColor Yellow -BackgroundColor Red
            Add-Content -Path ".\$FolderName\ErrorLog.txt" "$Name"
            }


        }
        try
        {
            $Table  | Sort Name | Select Name,LocalAdmins | Export-Csv -path ".\$FolderName\Report.csv" -Append -NoTypeInformation
        }
        catch
        {
            Write-Warning $_
        }
    }

    end{}
   }
   </pre>
    </div>
      </div>
    </div>
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse2">Collapsible Group 2</a>
        </h4>
      </div>
      <div id="collapse2" class="panel-collapse collapse">
        <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit,
        sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
      </div>
    </div>
    <div class="panel panel-default">
      <div class="panel-heading">
        <h4 class="panel-title">
          <a data-toggle="collapse" data-parent="#accordion" href="#collapse3">Collapsible Group 3</a>
        </h4>
      </div>
      <div id="collapse3" class="panel-collapse collapse">
        <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit,
        sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
        quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
      </div>
    </div>
  </div> 
</div>

＆＃13;

如何使用html和jquery在折叠下使用正确的文本格式显示文本

1 个答案: