英文:
Removing the HTML elements from the tooltip
问题
以下是您提供的HTML代码的翻译,其中已经删除了HTML标记:
<div class="row " id="record_block" style='margin-left:4px;margin-top:20px'>
@foreach ($infomodel as $applicant)
<div class="col-md-4 col-lg-4 col-xlg-4 mb-3">
<div class="card card-body" style="background: #ebefff;">
<div class="row">
<div class="col-md-4 col-lg-3 text-center">
<a href="app-contact-detail.html">
<img src="storage/image/<?php echo $applicant['photo_filename'];?>" alt="user" style="width: 85px; height: 80px;" class="img-circle img-responsive">
</a>
</div>
<div class="col-md-8 col-lg-9">
<h5>
<span style="z-index: 0;">
<span data-toggle="tooltip" data-placement="top" data-original-title="" style="background: transparent; color: #0b719c; margin-left: 0px; z-index: 0;">
{{ Str::limit($applicant->last_name . ', ' . $applicant->first_name . ' ' . $applicant->middle_name, 17) }}
<i class="flag-icon flag-icon-af" title=""></i><br>
<i>Doctor of Medicine</i><br>
</span>
<span class='tooltip-content' style="display: none;">
<span style="margin-left: 15px;">
<u><b>Fullname: {!! $applicant->last_name!!}, {!! $applicant->first_name!!} {!! $applicant->middle_name!!}</b></u><br/>
Birthdate: {!! $applicant->birthdate !!}<br/>
Country: {{ $applicant->country_name }}<br>
Gender/CS: {!! $applicant->gender !!}/Single<br>
Cellphone: <br>{!! $applicant?->country_code !!}{!! $applicant?->area_code !!}{!! $applicant?->tel_no !!}<br>
Email:{{ $applicant?->email }}<br>
Application ID:{!! $applicant?->app_id !!}<br>
Date Last Updated: {!! $applicant->date_updated !!}
</span>
</span>
</span>
</h5>
</div>
</div>
<div class="row">
<div class="col-md-8 col-lg-12">
<address style="color: black; margin-left: 10px;">
<abbr title="Email Address">Email:</abbr> <b>{{ $applicant?->email }}</b><br>
<abbr title="Cellphone">Cellphone:</abbr> <b>{!! $applicant?->country_code !!}{!! $applicant?->area_code !!}{!! $applicant?->tel_no !!}</b><br>
<abbr title="Application ID">Application ID:</abbr> <b>#{!! $applicant?->app_id !!}</b><br>
<div style="height: 8px;"></div>
<button type="button" class="btn btn-rounded btn-outline-primary" style="position: relative; z-index: 0;" title="Click to Manage" onclick="location.replace('manage_applicant-set_sessionvars.php?lnk=fi&purpose=2&a=2716');">
<i class="fa fa-address-card-o"></i> Manage
</button>
</address>
</div>
</div>
</div>
</div>
@endforeach
</div>
请注意,我已经将HTML标签从文本中删除,只保留了文本内容。
英文:
How can i remove the html tags because whenever i hover my house to a specific part, the data will be displayed but the html tags were also included. maybe theres something that needs to be changed.
html snippet
<div class="row " id="record_block" style='margin-left:4px;margin-top:20px'>
@foreach ($infomodel as $applicant)
<div class="col-md-4 col-lg-4 col-xlg-4 mb-3">
<div class="card card-body" style="background: #ebefff;">
<div class="row">
<div class="col-md-4 col-lg-3 text-center">
<a href="app-contact-detail.html">
<img src="storage/image/<?php echo $applicant['photo_filename'];?>" alt="user" style="width: 85px; height: 80px;" class="img-circle img-responsive">
</a>
</div>
<div class="col-md-8 col-lg-9">
<h5>
<span style="z-index: 0;">
<span data-toggle="tooltip" data-placement="top" data-original-title="" style="background: transparent; color: #0b719c; margin-left: 0px; z-index: 0;">
{{ Str::limit($applicant->last_name . ', ' . $applicant->first_name . ' ' . $applicant->middle_name, 17) }}
<i class="flag-icon flag-icon-af" title=""></i><br>
<i>Doctor of Medicine</i><br>
</span>
<span class='tooltip-content' style="display: none;">
<span style="margin-left: 15px;">
<u><b>Fullname: {!! $applicant->last_name!!}, {!! $applicant->first_name!!} {!! $applicant->middle_name!!}</b></u><br/>
Birthdate: {!! $applicant->birthdate !!}<br/>
Country: {{ $applicant->country_name }}<br>
Gender/CS: {!! $applicant->gender !!}/Single<br>
Cellphone: <br>{!! $applicant?->country_code !!}{!! $applicant?->area_code !!}{!! $applicant?->tel_no !!}<br>
Email:{{ $applicant?->email }}<br>
Application ID:{!! $applicant?->app_id !!}<br>
Date Last Updated: {!! $applicant->date_updated !!}
</span>
</span>
</span>
</h5>
</div>
</div>
<div class="row">
<div class="col-md-8 col-lg-12">
<address style="color: black; margin-left: 10px;">
<abbr title="Email Address">Email:</abbr> <b>{{ $applicant?->email }}</b><br>
<abbr title="Cellphone">Cellphone:</abbr> <b>{!! $applicant?->country_code !!}{!! $applicant?->area_code !!}{!! $applicant?->tel_no !!}</b><br>
<abbr title="Application ID">Application ID:</abbr> <b>#{!! $applicant?->app_id !!}</b><br>
<div style="height: 8px;"></div>
<button type="button" class="btn btn-rounded btn-outline-primary" style="position: relative; z-index: 0;" title="Click to Manage" onclick="location.replace('manage_applicant-set_sessionvars.php?lnk=fi&purpose=2&a=2716');"><i class="fa fa-address-card-o"></i> Manage</button>
</address>
</div>
</div>
</div>
</div>
@endforeach
</div>
答案1
得分: 4
将属性data-html="true"
添加到此span:
<span data-toggle="tooltip" data-placement="top" data-original-title="" style="background: transparent; color: #0b719c; margin-left: 0px; z-index: 0;" data-html="true">
根据文档,它允许在工具提示中使用HTML。
英文:
Add the attribute data-html="true"
to this span :
<span data-toggle="tooltip" data-placement="top" data-original-title="" style="background: transparent; color: #0b719c; margin-left: 0px; z-index: 0;">
As per the documentation, it allows HTML in the tooltip.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论